javascript - angularjs工厂未定义

我有以下userModule：

(function () {
var userModule = angular.module('user', [
    'Auth'
]);

userModule.controller('UserController', ['$http', '$scope', function (UserFactory) {
    var uc = this;
    uc.user ={}; //set when login

    uc.login = login;

    function login(username, password)
    {
        UserFactory.login(username,password).then(function success(reponse){
            uc.user = reponse.data
        })
    }
}]);

userModule.factory('UserFactory', function UserFactory ($http)
{
    'use strict';
    return{
        login: login
    };
    function login(username, password)
    {
        return $http.post(API_URL + '/login',
            {
                username: username,
                password: password
            });
    }

});

})();

现在，当我调用登录功能时，出现一个错误，告诉我UserFactory is undefined

谁能告诉我我做错了什么？

我的表格

        <form class="panel-body wrapper-lg" ng-controller="UserController as userCtrl"
          ng-submit="userCtrl.login(userCtrl.user.username, userCtrl.user.password)" >
        <div class="form-group">
            <label class="control-label">Brugernavn</label>
            <input type="email" class="form-control input-lg" id="txt_username" name="username"
                   placeholder="Brugernavn" ng-model="userCtrl.user.username">
        </div>
        <div class="form-group">
            <label class="control-label">Kodeord</label>
            <input type="password" name="password" placeholder="Kodeord" class="form-control input-lg"
                   ng-required="" ng-model="userCtrl.user.password">
        </div>
        <input type="submit" class="btn btn-lb-primary" value="Log på">

    </form>

最佳答案

当使用数组作为第二个参数定义控制器时，您实际上只是在告诉角度依赖性注入引擎在最后一个参数附带的函数/闭包中注入什么。因此，您必须明确告诉它注入UserFactory。在您的情况下，控制器闭包中的UserFactory将是$http服务的实例。

userModule.controller('UserController', ['$http', '$scope', 'UserFactory', function ($http, $scope, UserFactory) {
    var uc = this;
    uc.user ={}; //set when login

    uc.login = login;

    function login(username, password)
    {
        UserFactory.login(username,password).then(function success(reponse){
            uc.user = reponse.data
        })
    }
}]);

尽管我不确定是否有任何区别，但我想按时间顺序声明我的模块，服务等，即首先创建userModule，然后创建UserFactory，最后创建控制器。

为了进行优化，请尝试在工厂中使用与控制器相同的语法：

userModule.factory('UserFactory', ['$http', function UserFactory ($http)
{
    //....
}]);

使用数组语法的原因是，当您最小化js时，您的局部变量将具有某些服务无法解析的名称，因为angulars依赖注入器无法读取变量名称，最终看起来像：

userModule.factory('UserFactory', ['$http', function UserFactory (t)
{
    //....
}]);