Question

我有一个我无法解决的问题。该应用程序位于Angular JS中并使用pascalprecht.translate。我有一个以json形式从数据库中调用的项目列表。 json有两种语言的数据，阿拉伯语和英语。

如果通过适用/当前控制器中的$translate.use()更改语言，如何使选择框中的项目更改语言。我该如何实现呢？

我尝试了什么：

像所有其他翻译一样使用静态字段（这会使应用程序正常工作，但似乎是一种肮脏的方式来完成任务）
创建一个将密钥更改为en或ar的RootScope函数，但我无法确定如何在所有给定页面上的select元素上触发该函数。我不能想到$watch但我怎么能触发它来处理所有选择？

数据采用以下格式：

[
    {en:"Data in En 1", ar: "Data in Ar 1"},
    {en:"Data in En 2", ar: "Data in Ar 2"},
    {en:"Data in En 3", ar: "Data in Ar 3"},
    ...
]

问候！

Answer 1

您可以根据您的翻译格式创建一个过滤器来处理数据转换，如：

<span>{{ { "en":"Data in En 1", "ar": "Data in Ar 1"} | translateData }}</span>

以下代码是一个过滤器的简单实现，其行为与此类似，因此您可以对其进行修改以适合您的代码。

;(function () {

    angular.module('app.filters', ['ngTranslate'])
        .filter('translateData', TranslateData);

    function TranslateData($translate) {

        return function TranslateDataFilter(data) {

            if (!angular.isObject(data)) { // don't handle it if it's not an obj
                return data;
            }

            var lang = $translate.use(); // get current app language

            return data[lang]; // return the prop value named by the `lang`
        };
    }
})();

对来自数据库的项目使用$ translate

1 个答案: