这是这个demo的目录结构，总共有两个文件：locale-chinese.json和translation11.html
locale-chinese.json文件的内容是：
{
"beauty":"漂亮的",
"ugly":"丑陋的",
"people":"人民"
}
translation11.html的代码如下：
1 <!doctype html>
2 <html>
3 <head>
4 <meta charset="UTF-8">
5 <meta charset="UTF-8">
6 <script src="https://cdn.rawgit.com/SlexAxton/messageformat.js/v1.0.2/messageformat.js"></script>
7 <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.5/angular.js"></script>
8 <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.5/angular-animate.js"></script>
9 <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.5/angular-cookies.js"></script>
10 <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.5/angular-sanitize.js"></script>
11 <script src="https://cdn.rawgit.com/angular-translate/bower-angular-translate/2.16.0/angular-translate.js"></script>
12 <script src="https://cdn.rawgit.com/angular-translate/bower-angular-translate-interpolation-messageformat/2.16.0/angular-translate-interpolation-messageformat.js"></script>
13 <script src="https://cdn.rawgit.com/angular-translate/bower-angular-translate-storage-cookie/2.16.0/angular-translate-storage-cookie.js"></script>
14 <script src="https://cdn.rawgit.com/angular-translate/bower-angular-translate-storage-local/2.16.0/angular-translate-storage-local.js"></script>
15 <script src="https://cdn.rawgit.com/angular-translate/bower-angular-translate-loader-url/2.16.0/angular-translate-loader-url.js"></script>
16 <script src="https://cdn.rawgit.com/angular-translate/bower-angular-translate-loader-static-files/2.16.0/angular-translate-loader-static-files.js"></script>
17 <script src="https://cdn.rawgit.com/angular-translate/bower-angular-translate-handler-log/2.16.0/angular-translate-handler-log.js"></script>
18 </head>
19 <script>
20 angular.module(‘myApp‘,[‘ngCookies‘, ‘pascalprecht.translate‘])
21 .config([‘$translateProvider‘,function ($translateProvider) {
22 //加载json文件：$translateProvider.useStaticFilesLoader()这个方法非常重要：
23 $translateProvider.useStaticFilesLoader({
24 prefix:‘locale-‘,
25 suffix:‘.json‘
26 });
27 //load chinese table on start up:
28 $translateProvider.preferredLanguage(‘chinese‘);
29 }])
30 .controller(‘myCtrl‘,[‘$translate‘,‘$scope‘,function ($translate,$scope) {
31 $scope.changeLanguage=function (langKey) {
32 $translate.use(langKey);
33 }
34 }]);
35 </script>
36 <div ng-app="myApp" ng-controller="myCtrl">
37 <h1 translate="beauty"></h1>
38 <h1 translate="ugly"></h1>
39 <h1 translate="people"></h1>
40 </div>
41 </body>
42
43 </html>
运行结果如下：
时间： 2024-11-08 01:58:33