angularjs实现国际化

来源：互联网发布：风险评估矩阵算法编辑：程序博客网时间：2024/06/05 03:26

目的：利用angularjs自带模块实现网站的中英文切换

解：依据https://angular-translate.github.io/docs/#/guide

代码：
A：

 <!-- 开始引入国际化文件 xk -->        <script src="../assets/global/plugins/angularjs/angular-translate.min.js" type="text/javascript"></script>        <script src="../assets/global/plugins/angularjs/angular-translate-loader-static-files.min.js" type="text/javascript"></script>        <!-- 结束引入国际化文件 xk -->

B：

var MetronicApp = angular.module("MetronicApp", [    "ui.router",     "ui.bootstrap",     "oc.lazyLoad",      "ngSanitize",             //保证可以读到自定义的en.json cn.json文件    "pascalprecht.translate"  //引入国际化模块]);

C：

//开始国际化配置 xkMetronicApp.config(['$translateProvider',function($translateProvider){    var lang = window.localStorage.lang||'cn';  //可动态修改值    $translateProvider.preferredLanguage('cn');     //保证可以安全的获取到json文件    $translateProvider.useSanitizeValueStrategy('sanitize');    //保证可以正确的解析带有中文的json ---不加中文显示unicode     $translateProvider.useSanitizeValueStrategy('escapeParameters');    $translateProvider.useStaticFilesLoader({        prefix: 'i18n/',  //相对上下文环境路径        suffix: '.json'    });}]);//自定义过滤器MetronicApp.filter("T", ['$translate', function($translate) {    return function(key) {        if(key){            return $translate.instant(key);        }    };}]);// 结束国际化配置 xk

C：使用

<span>{{ 'china' | T }}</span>  //多虑器实现 <span>{{ 'english' | T }}</span>

D： json文件

{    "china": "中国",    "english": "英国"}

E：controller.js文件中使用国际化

angular.module('MetronicApp').controller(        'siteListController',        function($rootScope, $scope, $http, $timeout, $location, $state,$stateParams,$filter) {  //全局过滤器容器            // 全局变量 F5键刷新界面数据结束//          $rootScope.namexk = "rootName_123";//          $rootScope.agexk = "age_123";            console.log($filter('T')('china'));  //使用方式            layer.confirm($filter('T')('sureDelete'), {                      btn: ['确定','取消'] //按钮                    }, function(){                         $http.post("/portalmgr/wifiSite/deleteSiteById", {                                "ids" : idss.join(','), //绝佳的处理方式  此处保证数据的准确性 至于如何解析交给spring mvc了                                "siteNames" : siteNames.join(',')                            }).then(function(response) {                                console.log(response.data.status);                                if(response.data.status == 200) {                                    layer.msg('删除成功', {icon: 6});//笑脸                                }else if(response.data.status == 8888){                                    var alertt = response.data.data;                                    layer.msg('站点：' + alertt + "---下面存在设备，请先删除设备之后再删除站点", {icon: 5}); //哭脸                                }else {                                    layer.msg('删除失败', {icon: 3});//叉叉                                }                                $("#siteList").bootstrapTable('refresh');                            });                    }, function(){                    })

0 0