Question

所以我目前正在尝试在angularjs中创建一个双语站点。我正在做一个简单的ng-if，所以如果我的变量等于一个值，则它显示一种语言，如果等于另一种语言，则显示翻译。我的导航栏中有一个按钮，可以在不同的语言之间进行切换，但是似乎服务变量在更改时并未在每个控制器内进行更新。这是服务

angular.module('core.lc').factory('LangChoice', function() {
    var langOptions = ["Chinese", "English"];
    var langPos = 0;
    /* what a function */
    function switchLang() {
        if (langPos == 0) {
            langPos = 1;
        }
        else {
            langPos = 0;
        }
        return langPos;
    }

    return {
        langPos: langPos,
        langOptions: langOptions,
        switchLang: switchLang
    };
});

创建服务后，该值已由我现在遇到的问题返回的函数所解决的值所解决，因为只有一个控制器正在触发该函数，因此每个控制器都可以监视langPos值。任何帮助都将受到欢迎，谢谢。如果有更简单或更有效的方法来创建双语网站，请告诉我。

Answer 1

通常，我们为每个Language关键字创建单独的文件。当我们需要根据语言做出决定时，我们只需从所选语言中获取关键字，然后在页面上简单地使用它们即可。

STEPS

在单独的模块中创建数据服务，该模块将从单独的语言文件中获取数据。
将服务返回的数据绑定到对象中，然后简单地返回。
将服务引用到UI模块中，只需使用对象（UI模块的职责只是显示数据）。

返回责任的数据对象现在仅在数据服务中。

Answer 2

这主要是sudo代码，但它应该使您了解如何进行此操作。这并不是复制和粘贴的解决方案；

您应该创建翻译的哈希/字典，并创建一个过滤器，该过滤器将接收字符串并返回翻译后的字符串。

    Example of your HTML template:
        <h1>{{ $ctrl.title | translate }}</h1>

        Example of your relevant controller/directive:
        this.title = "Hello" // This would be your default language

        Example of the angularjs filter you need to create:
        const LANGUAGE_SET = "ZH"; // This needs to be set whenever you change your language and should be stored somewhere you globally. 

// These are your translations with the default language being the key.
        const Translations = {
            "Hello": {
                    "EN": "Hello",
                    "ZH" "你好",
                }
        }


    app.filter('translate',   function translate(original) {
            return Translations[original][LANGUAGE_SET];
        });

Answer 3

您可以在

之类的LangChoice服务上使用$ watch

$rootScope.$watch('LangChoice.myObject', function(newVal){
  console.log('data changes into: ', newVal)
}, true);

从服务中返回myObject，即，将myObject中的所有单个属性绑定并在控制器上观看。希望它能起作用。

如何在angularjs的整个应用程序中使用变量

3 个答案: