Question

我目前正在尝试学习如何使用Angular，我的任务是重写现有的功能页面以使用Angular。

我们的核心功能之一在于使用JavaScript函数翻译字符串，但是，只有在将翻译字符串加载到脚本中之后才会调用此翻译方法，并且异步完成加载。

我们目前使用回调来实现此行为，但由于Angular性质（至少在我的理解中），我的数据会在呈现页面时立即显示。

我有要翻译的字符串，但我想在我的表格中显示已翻译的字符串，为此我尝试创建一个过滤器＆＃34;翻译＆＃34;这将调用我现有的translate方法并返回其值。我相信它发生的事情是，在过滤器被调用的那一刻，我仍然没有翻译字符串，因为它们可能尚未被加载。

我期望的是{{object.name |翻译}}，其中object.name是一个要翻译的字符串，如＆＃34; access.granted＆＃34;，为我提供给定语言的相应翻译字符串，例如＆＃34;您被授予访问权限这个区域。＆＃34;。

我不是肯定的，这是达到我想要的最佳方式，我还没有多少时间深入研究角度，但我有一个要求，我无法改变翻译的处理方式因为我们已经有一个庞大的系统已经使用了该代码，并且使用angular的新页面必须完全兼容。

我尝试过:(我当前的过滤器代码）

function ngTranslate (text, backoff) {
    if (backoff != undefined)
        backoff = 100;
    if (backoff > 5000)
        backoff = 5000;

    if (internationalization != undefined && Object.keys(internationalization.messages).length > 0)
        return translate(text);

    setTimeout(function () {
        return ngTranslate(text, backoff * 2);
    }, backoff);
}

app.filter("translate", function ($log) {
    return function (key) {
        $log.info(key);
        return ngTranslate(key);
    };
});

我在这里尝试实现的是验证翻译字符串是否已经加载，如果没有，请在短时间内重试，但即使加载了翻译字符串，表格中也没有显示。

这是我的表格代码：

<tr data-ng-repeat="product in productList">
    <td>{{ product.name | translate }}</td>
</tr>

提前多多感谢

Answer 1

好吧，我能想到的一种方法是引导你的模块，加载字符串然后在回调函数中手动启动角度应用程序

使用此功能手动启动角度应用

https://docs.angularjs.org/api/ng/function/angular.bootstrap

这样，您可以确保在初始化应用程序之前加载所有翻译字符串。

AngularJS过滤器取决于异步调用

1 个答案: