Home > DeveloperSection > Blogs > Working with Internalization in Angularjs

Working with Internalization in Angularjs


Angular JS Angularjs Directive  Angularjs Filter 
Ratings:
0 Comment(s)
 624  View(s)
Rate this:

Working with Internalization in Angularjs

Hi everyone in this blog I’m explaining about Angularjs Internalization.

Introduction:

AngularJS supports inbuilt internationalization for three types of filters currency, date and numbers. We only need to incorporate corresponding js according to locale of the country. By default it handles the locale of the browser. For example, use following script.

<script src="https://code.angularjs.org/1.3.14/i18n/angular-locale_da-dk.js"></script>

Text.html:

<html>

<head>

    <title>Angular JS Forms</title>

</head>

<body>

    <h2>AngularJS Sample Application</h2>

    <div ng-app="mainApp" ng-controller="StudentController">

        {{fees | currency }}

        <br />

        <br />

        {{admissiondate | date }} 

        <br />

        <br />

        {{rollno | number }} 

    </div>

    <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script>

    <script src="https://code.angularjs.org/1.3.14/i18n/angular-locale_da-dk.js"></script>

    <script>

        var mainApp = angular.module("mainApp", []);

 

        mainApp.controller('StudentController', function ($scope) {

            $scope.fees = 1000;

            $scope.admissiondate = new Date();

            $scope.rollno = 123.45;

        });

 

    </script>

</body>

</html>

Now run your application:

 

Example using Browser's locale:

 

Text.html:

<html>

<head>

    <title>Angular JS Forms</title>

</head>

<body>

    <h2>AngularJS Sample Application</h2>

    <div ng-app="mainApp" ng-controller="StudentController">

        {{fees | currency }}

        <br />

        <br />

        {{admissiondate | date }} 

        <br />

        <br />

        {{rollno | number }} 

    </div>

    <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script>

     @*<script src="https://code.angularjs.org/1.3.14/i18n/angular-locale_da-dk.js"></script> *@

    <script>

        var mainApp = angular.module("mainApp", []);

 

        mainApp.controller('StudentController', function ($scope) {

            $scope.fees = 100;

            $scope.admissiondate = new Date();

            $scope.rollno = 123.45;

        });

 

    </script>

</body>

</html>

 

Now again run your application:


Don't want to miss updates? Please click the below button!

Follow MindStick