动态翻译服务Ionic 2 Angular 2 ngx-translate

时间:2017-07-10 15:03:25

标签: javascript angular ionic-framework ionic2 ngx-translate

我正在使用ionic 2构建应用程序,我想从服务器响应中转换一些对象,而不将其存储在JSON文件中。

我正在使用ngx-translate

例如,我收到一个这样的对象:

{
"name": ["Hello", "Hola", "Bon Jour"],
"description": ["This text is in English", "This text is in Spanish", "This text is in French"]
}

我想根据所选语言在我的应用中设置字符串的值。我怎样才能做到这一点?

非常感谢。

1 个答案:

答案 0 :(得分:1)

您可以使用3个键(en,es,fr)创建一个对象,然后使用它来设置每种语言使用' setTranslation'

示例:

translate.setTranslation('en', translations['en']);
translate.setTranslation('es', translations['es']);
translate.setTranslation('fr', translations['fr']);

生成此翻译'您可以迭代您拥有的数据和每个项目,使用数组中的索引获取每种语言的翻译。

let data = {
  "name": ["Hello", "Hola", "Bon Jour"],
  "description": ["This text is in English", "This text is in Spanish", "This text is in French"]
}

const translations = {en: [], es: [], fr: []};
Object.keys(data).forEach( key => {
  translations['en'][key] = data[key][0];
  translations['es'][key] = data[key][1];
  translations['fr'][key] = data[key][2];
});

console.log(translations); //this will output you object ready to be used in 'setTranslation'

这是working fiddle with this code

<强>更新

您可以使用setTranslation以更动态的方式重写该硬编码的片段

Object.keys(translations).forEach( key => {
  translate.setTranslation(key, translations[key]);
});

因此,您可以拥有多种(1..n)语言而无需重复代码。