angularjs+jquery 實現html國際化
阿新 • • 發佈:2019-01-05
引入檔案
使用jquery+angularJs 國際化首先要匯入一下檔案
定義propties 檔案<script type="text/javascript" src="../plug-in/jquery/jquery2.1.0.js"></script> <script type="text/javascript" src="../plug-in/angular/angular.js"></script> <script type="text/javascript" src="../plug-in/jquery/jquery.i18n.properties-1.0.9.js"></script>
(1)messageResources_en_US.properties內容如下
language=language(re)
firstName=firstName(re)
lastName=lastName(re)
age=age(re)
sex=sex(re)
birthday=birthday(re)
email=email(re)
address=address(re)
(2)messageResources_zh_CN.properties
language=語言
firstName=姓
lastName=名字
age=年齡
sex=性別
birthday=生日
email=電子郵箱
address=地址
<script> var app = angular.module("testint", []); function test($scope) { $scope.info = null; jQuery.i18n.properties({// 載入資瀏覽器語言對應的資原始檔 name : 'messageResources', // 資原始檔名稱 language : 'en_US', //預設為英文當改為zh_CN時頁面顯示中文語言 path : '../resource/', // 資原始檔路徑 mode : 'map', // 用 Map 的方式使用資原始檔中的值 callback : function() {// 載入成功後設置顯示內容 $scope.info = $.i18n.map; } }); } </script> </head> <body> <div ng-controller="test"> {{info.address}} <br>{{info.firstName}}<br> {{info.language}} </div> </body>
英文效果
中文效果