如何访问 ui-router 解析中的服务?

How can I access a service in a ui-router resolve?

我有一个 Angular 申请 app.js :

var app;

app = angular.module('app',
    [
        'exam',
        'ui.router'
    ])
    .controller('appController', AppController)
    .service('examService', ExamService));

我有一个配置文件:

var stateConfig = [
    '$locationProvider',
    '$sceDelegateProvider',
    '$sceProvider',
    '$stateProvider',
    'examService',
    function ($locationProvider, $sceDelegateProvider, $sceProvider, $stateProvider, examService) {
        $locationProvider.html5Mode(true);
        $sceProvider.enabled(false);

        var exams = {
            name: 'exams',
            url: '/Exams',
            templateUrl: 'app/exams/partials/home.html',
            resolve: {
                exams: examService.getAdminExams()
            }
        };

    $stateProvider.state(exams);
}];

app.config(stateConfig);

谁能给我一些建议。

当我 运行 它告诉我:

 Uncaught Error: [$injector:modulerr] Failed to instantiate module app due to:
Error: 
[$injector:unpr] 
Unknown provider: examService
http://errors.angularjs.org/1.3.7/$injector/unpr?p0=examService

我检查过,我的 examService 在其他两个文件之前声明:

<script src="/app/appController.js"></script>
<script src="/app/services/ExamService.js"></script>
<script src="/app/app.js"></script>
<script src="/app/appConfig.js"></script>
<script src="/app/appRun.js"></script>

同样在我的控制器中,我使用了 examService,它可以毫无问题地使用。

这是我的控制器的样子:

var AppController = (function () {
    function AppController($scope, $state, es) {
        var _this = this;
        this.$scope = $scope;
        this.$state = $state;
        this.es = es;

    }
    AppController.$inject = [
        '$scope',
        '$state',
        'examService'
    ];
    return AppController;
})();

您只能将供应商注入 config 块。尝试注入 $injector 并用它来获取你的 examService:

var stateConfig = [
    '$locationProvider',
    '$sceDelegateProvider',
    '$sceProvider',
    '$stateProvider',
    '$injector',
    function ($locationProvider, $sceDelegateProvider, $sceProvider, $stateProvider, $injector) {
        $locationProvider.html5Mode(true);
        $sceProvider.enabled(false);

        var exams = {
            name: 'exams',
            url: '/Exams',
            templateUrl: 'app/exams/partials/home.html',
            resolve: {
                exams: function() {
                   //retrieve your service
                   var examService = $injector.get('examService');
                   return examService.getAdminExams()
                }
            }
        };

    $stateProvider.state(exams);
}];

或者按照docs,可以这样直接注入:

resolve: {
     exams: function(examService) {
        return examService.getAdminExams();
     }
}

如果您缩小脚本,这可能不起作用。试试这个:

resolve: {
    exams: ['examService',function(examService) {
         return examService.getAdminExams();
    }]
}