路由器解析工厂未定义

我已经在UI-Router wiki和示例中遵循这些示例：https://scotch.io/tutorials/angular-routing-using-ui-router，但解析后的工厂在注入控制器时未定义。 任何帮助将不胜感激。

app var app = angular.module（'toa'，['ngResource'，'ui.bootstrap'，'ui.router']）;

app.config(function($stateProvider, $urlRouterProvider){
    $urlRouterProvider.otherwise('/');
    $stateProvider.state('home', {
        url: '/',
        views: {
            '' : {
              templateUrl: 'app/partials/home-partial.html'  
            },
            'sidebar@home': {
                templateUrl: 'loginMenu.html',
                controller: 'loginController'
            },
            'content@home': {
                templateUrl: 'app/views/home.html',
                controller: 'homeController'
            }
        }
    }).state('register', {
        url: '/register',
        views: {
            '': { templateUrl: 'app/partials/register-partial.html' },
            'content@register': {
                resolve: {
                    registerService: 'registerService'
                },
                templateUrl: 'app/views/registerView.html',
                controller: 'regController'
            }
        }
    });
});

调节器

app.controller('regController', ['$scope', '$location', '$resource', '$http', function($scope, $route, $routeParams, $location, $resource, $http, registerService){
   // Controller code is here console.log(registerService) prints undefined
}

服务

app.factory('registerService', ['$http', function($http){
    return {
        registerPlayer : function(playerName, playerPassword, playerEmail, playerGender) {
            var newPlayer = {
                ...
            };
            $http.post('...', newPlayer).
                success(function(data, status, headers, config) {
                    console.log(data);
                    console.log(status);
                }).
                error(function(data, status, headers, config) {
                    console.log(data);
                    console.log(status);
                });
        },
        checkEmail : function(emailIn) {
            var data = { email : emailIn };
            return $http.post('...', data).
                then(function(data) {
                    return data;
                });
        },
        checkUsername : function(usernameIn) {
            var data = { username : usernameIn };
            return $http.post('...', data).
                then(function(data) {
                    return data;
                });
        }
    };
}]);

---

首先，你忘记在控制器定义的数组表示法中以$http声明registerService 。

如果你想在路由配置中使用resolve block来注入某些东西，那么你需要提供一个返回somthing的函数，比如Promise，或者只是一个值。 在你的情况下试试这个：

resolve: {
    registerService: function(registerService) {
        return registerService;
    }
},

但是请注意，在您的情况下，您可以直接将服务直接注入控制器，因为您无需在此处解决它：

app.controller('regController', ['$scope', '$location', '$resource', '$http', 'registerService', function($scope, $route, $routeParams, $location, $resource, $http, registerService) {
   // Controller code is here console.log(registerService) prints undefined
}

---

resolve必须是使用函数而不是字符串。

将registerService: 'registerService'更改为如下所示：

registerService: function (){
      //here goes your resolve function.
}

---

解决您已经注入的服务毫无意义。 我认为在你的模块级别声明的服务的名称和已解决的依赖项的名称之间存在冲突，所以角度会丢失。

如果你想在进入你的控制器之前注册用户或检查电子邮件，那么解析会很有趣。

我建议你删除解析部分，然后确保在函数声明之前包含'registerService'字符串。

链接地址: http://www.djcxy.com/p/13635.html

上一篇: router resolve factory undefined

下一篇: Update controller data on factory data is changed Angular