AngularJS - 工厂未定义？

Question

我正在尝试将工厂注入(inject) Controller 。 工厂应该管理身份验证事件。

这是一些代码:

'use strict';

/**
 * @ngdoc function
 * @name LoginCtrl
 * @module triAngularAuthentication
 * @kind function
 *
 * @description
 *
 * Handles login form submission and response
 */
angular.module('triAngularAuthentication')
.factory('Auth', ['$http', 'localStorageService', function ($http, localStorageService, API_REST) {
       function urlBase64Decode(str) {
           var output = str.replace('-', '+').replace('_', '/');
           switch (output.length % 4) {
               case 0:
                   break;
               case 2:
                   output += '==';
                   break;
               case 3:
                   output += '=';
                   break;
               default:
                   throw 'Illegal base64url string!';
           }
           return window.atob(output);
       }

       function getClaimsFromToken() {

           var token = localStorageService.get('token');
           var user = {};

           if( token !== null){
               if (typeof token !== 'undefined') {
                   var encoded = token.split('.')[1];
                   user = JSON.parse(urlBase64Decode(encoded));
               }
           }
           return user;
       }

       var tokenClaims = getClaimsFromToken();

       return {
           signup: function (data, success, error) {
               $http.post(API_REST + '/signup', data).success(success).error(error)
           },
           signin: function (data, success, error) {
               $http.post(API_REST + '/login', data).success(success).error(error)
           },
           logout: function (success) {
               tokenClaims = {};
               localStorageService.remove('token');
               success();
           },
           getTokenClaims: function () {
               return tokenClaims;
           }
       };
   }
])
.controller('LoginController', ['$rootScope', '$scope', '$location', 'Auth', function ($scope, $state, API_REST, localStorageService, $rootScope, Auth) {
    function successAuth(res) {
        localStorageService.token = res.token;
        $state.go('admin-panel.default.dashboard-analytics');
    }
    // create blank user variable for login form
    $scope.user = {
        email: '',
        password: ''
    };

    $scope.socialLogins = [{
        icon: 'fa-twitter',
        color: '#5bc0de',
        url: '#'
    },{
        icon: 'fa-facebook',
        color: '#337ab7',
        url: '#'
    },{
        icon: 'fa-google-plus',
        color: '#e05d6f',
        url: '#'
    },{
        icon: 'fa-linkedin',
        color: '#337ab7',
        url: '#'
    }];

    // controller to handle login check
    $scope.loginClick = function() {

        Auth.signin( $scope.user, successAuth, function(){
            console.log('Error al loguear');
        });
    };
}]);

但是当我执行 loginClick 时，我收到此控制台错误消息:

TypeError: Cannot read property 'signin' of undefined
    at Scope.$scope.loginClick (http://localhost:3000/app/authentication/login/login-controller.js:98:13)
    at fn (eval at <anonymous> (http://localhost:3000/bower_components/angular/angular.js:13036:15), <anonymous>:4:221)
    at http://localhost:3000/bower_components/angular-touch/angular-touch.js:477:9
    at Scope.$eval (http://localhost:3000/bower_components/angular/angular.js:15719:28)
    at Scope.$apply (http://localhost:3000/bower_components/angular/angular.js:15818:23)
    at HTMLButtonElement.<anonymous> (http://localhost:3000/bower_components/angular-touch/angular-touch.js:476:13)
    at HTMLButtonElement.jQuery.event.dispatch (http://localhost:3000/bower_components/jquery/dist/jquery.js:4435:9)
    at HTMLButtonElement.elemData.handle (http://localhost:3000/bower_components/jquery/dist/jquery.js:4121:28)

我是 Angular 新手，我不知道我做错了什么。

Answer 1

在工厂和 Controller 内添加缺少的API_REST Angular 常量依赖项

工厂

.factory('Auth', ['$http', 'localStorageService', 'API_REST', 
    function ($http, localStorageService, API_REST) {

Controller 还搞乱了依赖项的顺序，并且缺少像 $state 和 $location 这样的依赖项。

Controller

.controller('LoginController', ['$rootScope', '$scope', '$state', 'API_REST',  'localStorageService', '$location', 'Auth', 
    function ($rootScope, $scope, $state, API_REST, localStorageService, $location, Auth) {

您应该遵循注入(inject)数组并在函数中使用它的顺序。

编辑

似乎某些依赖项没有得到使用，您可以删除它们，因为它们没有被使用。 API_REST、$rootScope 和 $location