向Angular的app.config添加2个提供程序

时间:2015-04-27 03:05:51

标签: javascript angularjs

所以我正在尝试为我的app.config函数添加另一个翻译提供程序,目前我只是像这样使用$routeProvider

var app = angular.module('app', ['ngRoute', 'home', 'about', 'contact', 'session', 'auth-token-interceptor']);

    app.config(['$routeProvider', function($routeProvider) {
        $routeProvider.
            otherwise({
                redirectTo: '/'
            });
    }]);

这很好,现在我正在尝试按照本教程向我的Angular应用添加一些简单的翻译:

http://www.ng-newsletter.com/posts/angular-translate.html

我对在翻译及其结构中添加的确切位置感到有些困惑。

我最初的问题只是将angular-translate作为依赖项,我尝试了这个:

var app = angular.module('app', ['ngRoute', 'home', 'about', 'contact', 'session', 'auth-token-interceptor', 'test.translate' ]);

但仅此一项导致应用程序实际上没有加载,所以我必须在这里做错事。以下是我在Chrome控制台中遇到的错误:

Failed to instantiate module app due to:
Error: [$injector:modulerr] http://errors.angularjs.org/1.3.15/$injector/modulerr?p0=...)
    at Error (native)
    at http://localhost:8888/test/frontend/js/angular.min.js?t=1430103821:6:417
    at http://localhost:8888/test/frontend/js/angular.min.js?t=1430103821:35:320
    at r (http://localhost:8888/test/frontend/js/angular.min.js?t=1430103821:7:302)
    at g (http://localhost:8888/test/frontend/js/angular.min.js?t=1430103821:34:399)
    at http://localhost:8888/test/frontend/js/angular.min.js?t=1430103821:35:63
    at r (http://localhost:8888/test/frontend/js/angular.min.js?t=1430103821:7:302)
    at g (http://localhost:8888/test/frontend/js/angular.min.js?t=1430103821:34:399)
    at ab (http://localhost:8888/test/frontend/js/angular.min.js?t=1430103821:38:135)
    at d (http://localhost:8888/test/frontend/js/angular.min.js?t=1430103821:17:381

我的下一个问题是在$translateProvider$添加的位置和方式。我已经尝试将它与$routeProvider一起添加,我尝试将其作为数组中的第二项添加但两者都不起作用(可能是因为第一个问题导致应用程序崩溃我是不确定)。

以下是我尝试在教程中使用的$translateProvider设置:

app.config(function($translateProvider) {
  $translateProvider.translations('en', {
    HEADLINE: 'Hello there, This is my awesome app!',
    INTRO_TEXT: 'And it has i18n support!'
  });
});

1 个答案:

答案 0 :(得分:1)

您应该像在ngRoute模块中那样将它添加到app依赖关系数组中,angular-translate依赖关系模块名称为pascalprecht.translate

var app = angular.module('app', ['ngRoute', 
                                 'home',
                                 'about', 
                                 'contact', 
                                 'session', 
                                 'auth-token-interceptor', 
                                 'pascalprecht.translate' //<--here the angular-translate dependancy inject
                                ]
                        );