目的:利用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:
//开始国际化配置 xk
MetronicApp.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(){
})