Thursday, 26 April 2018

015 AngularJS Internationalization

AngularJS Internationalization
 
         AngularJS have fracture  to supports internationalization ,it is inbuilt functionality of AngularJS .Internationalization works for three types of filters currency, date and numbers. For internationalization , you have to load different .js file . 

For example

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

France :
           <script src="https://code.angularjs.org/1.4.8/i18n/angular-locale_fr-fr.js"></script>

For example  , we are using "Danish locale" 

Example

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
</head>
             <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8 /angular.min.js"> </script>
             <script src ="https://code.angularjs.org/1.4.8/i18n/angular-locale_da-dk.js"> </script>

<script>

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

     App.controller('myController', function ($scope) 
  {
     $scope.StudentName = " Student 1";
     $scope.AdmissionFees = 100;
     $scope.AdmissionDate = new Date();
     $scope.MarksPercentage = 123.45;

     });

</script>
<body>
<div ng-app="myApp" ng-controller="myController">
            {{StudentName }}
<br />
<br />
           {{AdmissionFees | currency }}
<br />
<br />
            {{AdmissionDate | date }}
<br />
<br />
             {{MarksPercentage | number }}
</div>
</body>
</html>

Output :













If we use
France :
           <script src="https://code.angularjs.org/1.4.8/i18n/angular-locale_fr-fr.js"></script>

Output :













If we want to apply , angularJS internationalization file dynamically.You need to write conditional statement.


<script>
          var language = '<%=language%>'
          var locale='';
          if(language=="en")
          {
                     locale="haw-us";
          }
          else if (language "da")
          {
                    locale="da-dk";
          }
          else 
     {
                     locale="fr-fr";
         }
      document.write('

No comments:

Post a Comment

Interactive CSS Button Designer Tool – Free & Fast

What is Button ?                               Button  is an element of HTML. HTML is used to design Web Page and Website and Web applicatio...