在控制器中正确使用angular-translate

7 浏览
0 Comments

在控制器中正确使用angular-translate

我在一个AngularJS应用程序中使用angular-translate来进行国际化（i18n）。

对于每个应用程序视图，都有一个专用的控制器。在下面的控制器中，我设置要显示的值作为页面标题。

代码

HTML

{{ pageTitle }}

JavaScript

.controller('FirstPageCtrl', ['$scope', '$filter', function ($scope, $filter) {
        $scope.pageTitle = $filter('translate')('HELLO_WORLD');
    }])
.controller('SecondPageCtrl', ['$scope', '$filter', function ($scope, $filter) {
        $scope.pageTitle = 'Second page title';
    }])

我使用angular-translate-loader-url扩展来加载翻译文件。

问题

在初始页面加载时，显示的是翻译键而不是该键的翻译。翻译是Hello, World!，但我看到的是HELLO_WORLD。

第二次访问该页面时，一切正常，显示的是翻译后的版本。

我认为问题可能是因为当控制器将值赋给$scope.pageTitle时，翻译文件可能还没有加载。

备注

当使用

{{ pageTitle | translate }}

和$scope.pageTitle = 'HELLO_WORLD';时，翻译从第一次就正常工作。但这样做的问题是，我并不总是希望使用翻译（例如，对于第二个控制器，我只想传递一个原始字符串）。

问题

这是一个已知的问题/限制吗？如何解决这个问题？

0