如何在来自另一个文件的控制器中定义变量？

Question

这是我的示例代码：en.js

var translationsEN = {

USERNAME:     'Username',
PASSWORD:     'Password',
LOGIN:    'Login',
CANCEL:   'Cancel' };

和我的控制器：

.config(function ($routeProvider, $translateProvider) {
...
$translateProvider.translations('en_US', translationsEN);
$translateProvider.preferredLanguage('en_US');
...

我正在使用 Pascal Precht 的 angular-translate 模块。 当我更新文件时，控制台中显示消息：“translationsEN 未定义”（在我的控制器中）和来自我的语言文件的消息：“translationsEN 已定义但从未使用”

如何在控制器中定义变量？我需要将变量定义为服务吗？

Answer 1

实现目标的 Angular 方法确实是使用 service，或者，对于简单且恒定的变量，使用 constant service：

myModule.constant(
    'myModule.translations.EN',
    {
        USERNAME: 'Username',
        PASSWORD: 'Password',
        LOGIN: 'Login',
        CANCEL: 'Cancel'
    }
);

你所要做的就是将它注入你的配置方法中：

myModule.config([
    '$routeProvider',
    '$translateProvider',
    'myModule.translations.EN',
    function ($routeProvider, $translateProvider, translationsEN) {
        // …
        $translateProvider.translations('en_US', translationsEN);
        $translateProvider.preferredLanguage('en_US');
    }
]);

如果由于某些原因，您绝对需要使用经典变量，例如因为它也在非 Angular 脚本中使用，请确保在配置方法之前声明它。

Answer 2

正如@Blackhole 在他的回答中解释的那样，以角度实现这一目标的一般方法是使用提供者。

但是，在您的 angular-translate 的特定用例中，实现此目的的方法是使用 $translateProvider 加载您的翻译文件：

将en.js 重命名为en_US.json 并将其放在一个名为/locales 的文件夹中。确保您的文件是有效的 json，即您要删除 var translationsEN =。

然后像这样配置$translateProvider：

$translateProvider.useStaticFilesLoader({
    prefix: '/locales/',
    suffix: '.json'
});

这将加载您所有的 json 翻译文件，位于文件夹 /locales。

这样您的翻译文件将完全独立于您的应用程序逻辑。