html改语言,根据使用json选择的语言更改html页面的内容

解决方案构想

这种情况的最佳解决方案是提供服务,管理我们应用中的所有语言问题.这样的语言服务应该知道当前在页面上设置了什么语言并从适当的语言数组中获取文本.

此类服务中的一些示例getter应如下所示：

this.getText = function(textSymbol){

return langTexts[currentChosenLanguageSymbol][textSymbol];

}

用法示例：

someLangService.getText("name");

因此,使用此服务的开发人员只需要知道单词符号,服务应该提供正确的单词.

解决方案示例

我用工作示例创建了工作服务：

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

app.service("lang",function(){

//possible to choose langs

var langs=[

{label:"English",symbol:"english",id:1},{label:"Arabic",symbol:"arabic",id:2}

];

//object contains lang texts used in app

var texts={

"english":{

"name":"Sherif","phone" :"(234)567-0988"

},"phone": "(234)567-0988"

}

};

this.getLangueges = function(){

return langs;

};

this.setLanguage = function(lang){

this.language=lang;

};

this.getLanguage = function(){

return this.language;

};

this.getText = function(symbol){

return texts[this.language.symbol][symbol];

};

//set default as english

this.setLanguage(langs[0]);

});

app.controller('controller',function(lang,$scope){

//set service into view

$scope.lang = lang;

});

{{lang.getText("name")}}

还有一点需要注意 – 我已经改变了存储语言文本的一点点格式,粘贴的结构在不同语言中有不同的键,我们需要具有不同值的相同键.

感谢这项服务,我们不需要直接使用数组,但它为此提供了抽象级别,使用它我们可以只提供文本符号和服务将获得正确的当前选择语言的文本.

我希望这将有所帮助.