Question

我现在已经在这个问题上摸不着头几个小时了，经过大量的搜索，我找不到有用的解决方案。

作为标题状态，我的依赖关系不会被Angular的路由提供程序解析。这是错误：

Unknown provider: testServiceProvider <- testService <- testService

我编译的Javascript文件（app.js）如下所示：

'use-strict';

var app = angular.module('test-app', ['ngRoute']);

app.config(['$routeProvider', function ($routeProvider) {
    $routeProvider
        .when('/', {
            templateUrl: 'views/home.html',
            controller: 'HomeController',
            resolve: {
                testService: function (testService) {
                    console.log(testService.message);
                }
            }
        })
}]);

app.factory('apiService', ['$http', function ($http) {
    function url(endpoint) {
        return '/api/v1' + endpoint;
    }

    return {
        user: {
            authenticated: function () {
                return $http({method: 'GET', url: url('/user/authenticated')});
            },

            login: function (token) {
                return $http({method: 'GET', url: url('/user/login'), cache: false, headers: {
                    Authorization: 'Basic ' + token
                }});
            },

            logout: function () {
                return $http({method: 'GET', url: url('/user/logout')});
            },

            model: function () {
                return $http({method: 'GET', url: url('/user/data')});
            }
        }
    };
}]);

app.factory('testService', function () {
    return {
        message: 'Hello world'
    };
});

app.controller('HomeController', ['$scope', '$http', function ($scope, $http, apiService, testService) {
    $scope.user = {
        authenticated: false,
        error: '',
        username: '',
        password: ''
    };

    $scope.login_button = 'Log in';

    $scope.isAuthenticated = function () {
        return $scope.user.authenticated;
    }

    $scope.needsAuthentication = function () {
        if (!$scope.user.authenticated) {
            return true;
        }

        return false;
    }

    $scope.logIn = function ($event) {
        $event.preventDefault();

        $scope.login_button = 'Please wait...';

        var token = btoa($scope.user.username + ':' + $scope.user.password);

        apiService.user.login(token).then(function (success) {
            $scope.user = success.data.user;

            $scope.user.authenticated = true;
        }, function (error) {
            $scope.user.error = 'Please try logging in again.';

            $scope.login_button = 'Log in';
        });
    };
}]);

据我所知，一切都应该解决得很好;我错过了什么或误解了什么？

Answer 1

你必须注入服务，

更改

发件人：

app.controller('HomeController', ['$scope', '$http', function ($scope, $http, apiService, testService)

要

app.controller('HomeController', ['$scope', '$http','apiService','testService' ,function ($scope, $http, apiService, testService)

Answer 2

我认为别名中的问题。您使用testService作为解析的别名。 $ injector可能会混淆。尝试重命名它，例如：

resolve: { testData: function (testService) { console.log(testService.message); } }

并将其重命名为控制器。

Angular route无法解析服务

2 个答案: