javascript - 类型错误:Users.create 不是函数

Question

我的代码运行良好。我添加了一些新的登录功能，但它破坏了它。所以我删除了代码。这是原始格式，但错误仍然存​​在，用户服务的创建函数不是函数。我已阅读了有关该主题的许多问题，但没有一个答案有帮助。

用户 Controller

todoApp.controller('UserController', ['Users','$scope', function UserController(Users, $scope) {
    console.log("in user controller");

    $scope.formModel = {};
    $scope.submitting = false;
    $scope.submitted = false;
    $scope.has_error = false;

    console.log($scope.formModel);
    $scope.createUser = function() {
        if(!$scope.registerForm.$valid) {
            return;
        }
        Users.create($scope.formModel)
        .success(function(data){

            $scope.submitting = false;
            $scope.submitted = true;
            $scope.has_error = false;
            $scope.formModel = {}; // clear the form so our user is ready to enter another
            $scope.users.push(data);
            console.log(":)");
        }).error(function(data) {
            console.log(":(");
            $scope.submitting = false;
            $scope.submitted = false;
            $scope.has_error = true;
        });


    };

}]);

user.service.js

todoApp.factory('Users', ['$http', function($http) {
    return {
        get: function() {
            return $http.get('/api/users');
        },

        create: function(userData) {
            console.log(userData);
            return $http.post('/api/users', userData);
        },

        delete: function(id) {
            return $http.delete('/api/users/' + id);
        },

        update: function(userData) {
            return $http.put('/api/users/' + userData.id, userData);
            console.log(userData);
        }
    }
}]);

注册.html

<div class="container">

    <div class="row main"  ng-controller="UserController">
        <div class="main-login main-center">
        <h5>Sign up once for instant access.</h5>
            <form name="registerForm" ng-submit="createUser()"
                novalidate="novalidate"
                ng-hide="submitted" >

                <div class="form-group">
                    <label for="name" class="cols-sm-2 control-label">Your Name</label>
                    <div class="cols-sm-10">
                        <div class="input-group">
                            <span class="input-group-addon"><i class="fa fa-user fa" aria-hidden="true"></i></span>
                            <input type="text" 
                                class="form-control" 
                                ng-model="formModel.name"
                                id="name"  
                                placeholder="Enter your Name"
                                required="required" />
                        </div>
                    </div>
                </div>

                <div class="form-group">
                    <label for="email" class="cols-sm-2 control-label">Your Email</label>
                    <div class="cols-sm-10">
                        <div class="input-group">
                            <span class="input-group-addon"><i class="fa fa-envelope fa" aria-hidden="true"></i></span>
                            <input type="email" 
                                class="form-control" 
                                ng-model="formModel.email"
                                id="email"  
                                placeholder="Enter your Email"
                                required="required" />
                        </div>
                    </div>
                </div>

                <div class="form-group">
                    <label for="username" class="cols-sm-2 control-label">Username</label>
                    <div class="cols-sm-10">
                        <div class="input-group">
                            <span class="input-group-addon"><i class="fa fa-users fa" aria-hidden="true"></i></span>
                            <input type="text" 
                                class="form-control" 
                                ng-model="formModel.username"
                                id="username"  
                                placeholder="Enter your Username"
                                required="required" />
                        </div>
                    </div>
                </div>

                <div class="form-group">
                    <label for="password" class="cols-sm-2 control-label">Password</label>
                    <div class="cols-sm-10">
                        <div class="input-group">
                            <span class="input-group-addon"><i class="fa fa-id-badge" aria-hidden="true"></i></span>
                            <input type="password" 
                                class="form-control" 
                                ng-model="formModel.password" 
                                id="password"  
                                placeholder="Enter your Password"
                                required="required" />
                        </div>
                    </div>
                </div>

                    <label for="confirm" class="cols-sm-2 control-label">Confirm Password</label>
                    <div class="cols-sm-10">
                        <div class="input-group">
                            <span class="input-group-addon"><i class="fa fa-lock fa-lg" aria-hidden="true"></i></span>
                            <input type="password" 
                            class="form-control" 
                            name="confirm" 
                            id="confirm"  
                            placeholder="Confirm your Password"
                            required="required" />
                        </div>
                    </div>
                </div>

                <div class="form-group" >
                    <label for="type" class="cols-sm-2 control-label">User Type</label >
                    <div class="cols-sm-10">
                        <span class="input-group-addon"><i class="fa fa-university" aria-hidden="true"></i></span>
                        <select id="type"
                                        class="form-control"
                                        ng-model="formModel.role"
                                        required="required" >
                            <option value="" >Please Choose</option >
                            <option value="1" >Lecturer</option >
                            <option value="2" >Student</option >
                        </select >
                    </div>
                </div >
                <div>
                    <button class="btn btn-primary"
                            ladda="submitting"
                            data-style="expand-right"
                                type="submit">
                        <span ng-show="submitting">Registering</span>
                        <span ng-show="!submitting">Register</span>
                    </button>
                </div>        
            </form>
        </div>
    </div>
</div>

Answer 1

您应该返回带有值的回调，而不是从服务器返回 HTTP 原始 promise 。试试这个

服务

create: function(userData, callback) {
      $http.post('/api/users', userData).then(function (res) {
            return callback(res.data); 
      }, 'error')
},

Controller

//Angular 1.5 已弃用 Success >

//从服务器返回成功代码(这不是真正的错误代码，如 404 和 500。这只是您从服务器提供的代码) - 假设服务器成功返回 json 格式 - {code: '0000' ，备注:'成功'}和错误 - {代码:'9999'，备注:'成功'}。这取决于您的服务器。这就是我在之前的项目中所做的

 $scope.createUser = function() {
    if(!$scope.registerForm.$valid) {
        return;
    }
    Users.create($scope.formModel, function (res) {
         switch (res.code) {
           case '0000':
               $scope.submitting = false;
               $scope.submitted = true;
               $scope.has_error = false;
               $scope.formModel = {}; // clear the form so our user is ready to enter another
               $scope.users.push(data);
        console.log(":)");
               break;
          case '9999': 
                console.log(":(");
                $scope.submitting = false;
                 $scope.submitted = false;
                $scope.has_error = true;
                console.log('error');
               break;
      }
    });
};

假设您的服务器不返回错误代码，只返回数据。你可以这样做

 $scope.createUser = function() {
    if(!$scope.registerForm.$valid) {
        return;
    }
    Users.create($scope.formModel, function (res) {
        if (res !== undefined) {          
               $scope.submitting = false;
               $scope.submitted = true;
               $scope.has_error = false;
               $scope.formModel = {}; // clear the form so our user is ready to enter another
               $scope.users.push(data);
        } else {
                console.log(":(");
                $scope.submitting = false;
                 $scope.submitted = false;
                $scope.has_error = true;
                console.log('error');
       }
      }
    });