javascript - 本地化 angularjs Controller 内的字符串属性

标签 javascript jquery angularjs

在我的 angularjs Controller 中,我正在注入(inject)翻译服务

(function () {
    "use strict";
    app.controller('homeController', ['$scope', translationService) {

    //Run translation if selected language changes
    $scope.translate = function () {            
        translationService.getTranslation($scope, $scope.selectedLanguage);
    };       
    $scope.translate();
}

在内部 View 中我正在翻译类似的文本

{{ translation.HelloWorld }}

其中 HelloWorld 是语言 json 文件中的字符串。

因为我能够使用 $scope.selectedLanguage 检测当前选择的语言这将返回所选语言的字符串 eng , rus , fra例如,如何翻译 Controller 内对象属性内注入(inject)的文本

var myObj = { Id: 1, Name: "Default", Description: "Default" };

如何本地化名称和描述属性?

更新:

app.service('translationService', function ($resource) {    
    this.getTranslation = function ($scope, language) {
        var languageFilePath = '../app/locStrings/translation_' + language + '.json';
        $resource(languageFilePath).get(function (data) {
            $scope.translation = data;
        });
    };
});

其中每个文件都有前缀 translation_喜欢

translation_eng.json 

translation_fra.json 内容

{
    "HELLO_WORLD": "Hello world en",
}

最佳答案

How can I use localization in Angular?

您可以通过简单地使用 rootScope 对象来使用 Angular 中的本地化。它的工作原理与 .net 本地化概念非常相似。

Localization Schema.

它与.net本地化非常相似,在.net中你可以放置一个本地化文件,其中所有语言翻译都以表格格式存储。 在这里您可以根据您的方便使用两个文件或一个文件。 (我更喜欢每种语言的单独文件)

所有语言都在一个文件中。

{
  translationkey1:{
      en:'translationValue_english1',
      hi:'translationValue_hindi1',
      fr:'translationValue_french1',
  },
  translationkey2:{
      en:'translationValue_english2',
      hi:'translationValue_hindi2',
      fr:'translationValue_french2',
  },
  translationkey3:{
      en:'translationValue_english2',
      hi:'translationValue_hindi2',
      fr:'translationValue_french2',
  }
}

每种语言都有单独的文件。

{
  translationkey1:'translationValue1',
  translationkey2:'translationValue2',
  translationkey3:'translationValue3',
}

Usage in View

将翻译文件对象复制到 rootscope 的翻译对象中,以便您可以在任何地方访问它。

所有语言都在一个文件中。

{{translations[myObj.Name][selectedLanguage]}} // It will return English value for specific value from translation object.

每种语言都有单独的文件。

如果您使用单独的文件,则无需存储 selectedLanguage 格式,只需按语言保留翻译对象即可。

{{translations[myObj.Name]}}

Which is good approach.

如果翻译文件太大,则为每种语言使用单独的文件是一个好方法。它增加了服务器点击率,但您可以轻松维护翻译。

使用单个文件来存储所有语言相当增加内存消耗。但减少了服务器点击率。

Here就是你的答案。

关于javascript - 本地化 angularjs Controller 内的字符串属性,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31130658/

相关文章:

javascript - 一次提交2份表格

用于检查用户名和密码字段的 Javascript 函数,如果它们没有相应地完成则停止

javascript - 我可以将 async wait 与 firebase 数据库调用一起使用吗?

javascript - 如何强制下载而不是打开文件?

javascript - Angularjs输入ng-model仅包含两位小数或数字

javascript - JS如何只查看表格中的H2标签

javascript - Angular 中使用动态表头的表

javascript - Jquery Sticky 导航在满足特定条件时启动

android - ionic 框架 : conditional animation depending on the os

javascript - 可变变量可以从 Angular 闭包访问