Angular的工厂方法不是一个函数(dataFactory).addContact不是一个函数)

Angular factory method is not a function (dataFactory.addContact is not a function)

本文关键字：一个 函数 addContact dataFactory 方法 工厂 Angular      更新时间：2023-09-26

我试图将控制器和工厂拆分为单独的文件。然而，当分离工厂方法时，会产生一个错误:"dataFactory. "addContact不是一个函数"…我肯定我错过了一些基本的东西。

//

的错误
TypeError: dataFactory.addContact is not a function
at Scope.$scope.AddContactToDb (http://localhost:3000/assets/js/controllers/contacts/main.js:28:15)
at Scope.$scope.AddContact (http://localhost:3000/assets/js/controllers/contacts/main.js:56:25)
at fn (eval at <anonymous> (http://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.0-beta.1/angular.js:13391:15), <anonymous>:2:229)
at ngEventDirectives.(anonymous function).compile.element.on.callback (http://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.0-beta.1/angular.js:23619:17)
at Scope.$get.Scope.$eval (http://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.0-beta.1/angular.js:16058:28)
at Scope.$get.Scope.$apply (http://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.0-beta.1/angular.js:16158:25)
at HTMLInputElement.<anonymous> (http://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.0-beta.1/angular.js:23624:23)
at HTMLInputElement.eventHandler (http://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.0-beta.1/angular.js:3299:21)(anonymous function) @ angular.js:12546$get @ angular.js:9307$get.Scope.$apply @ angular.js:16163(anonymous function) @ angular.js:23624eventHandler @ angular.js:3299
(anonymous function) @ angular.js:12546
$get @ angular.js:9307
$get.Scope.$apply @ angular.js:16163
(anonymous function) @ angular.js:23624
eventHandler @ angular.js:3299
下面是我的代码: //datafactory.js 

app.factory('dataFactory', ['$http', function ($http){
    var dataFactory = {
        getContactList: function(){
            return $http.get("/api/contacts"); 
        },
        addContact: function(newContact){
            return $http.post("/api/contacts", newContact);  
        }
    };

    return dataFactory;
}]);
//controller.js 

app.controller('contactlist', ['$scope', '$http', '$routeParams', 'dataFactory', function ($scope, $http, $routeParams, dataFactory){
    //get contact list
    dataFactory.getContactList().success(function(response){ //<< works
        $scope.contacts = response;
    });
    //add contact to db 
    $scope.AddContactToDb = function(newContact){
        dataFactory.addContact(newContact).success(function(){ //<< fails (dataFactory.addContact is not a function)
            $scope.Status = "New contact: '" + newContact.name + "' was successfully inserted.";
        }).error(function(error){
            console.log(error);
        });
    };
//add contact
$scope.AddContact = function(){
    if($scope.contactform.$valid) {
        var newContact = 
        {
            name : $scope.Contact.Name,
            email : $scope.Contact.Email,
            number : $scope.Contact.Number
        };
        $scope.contacts.push(newContact);
        var success = $scope.AddContactToDb(newContact);
        if(success){
            resetForm();
        }
    } else {
        return;
    }
};
}]);

我确实看到有两个方法与名称addContact。区别在于区分大小写。请调用"AddContact"方法，而不是"AddContact"。

//with factory
angular.module('app.services', [])
.factory('LoginFactory', ['$http', function($http) {
    return {
        getConnexion: function(newData) {
            var url = "http://localhost:9100/connexion";
            return $http.post(url, newData);
        }
    }
}])
//in controller
angular.module('app.controllers', [])
.controller('homeCtrl', ['$scope', '$stateParams', 'LoginFactory', '$ionicPopup', '$state', '$http',
    function($scope, $stateParams, LoginFactory, $ionicPopup, $state, $http) {
        function checkEmail(email) {
            var re = /'S+@'S+'.'S+/;
            return re.test(email);
        }
        $scope.connexion = function() {
            if (typeof this.email !== "undefined" && typeof this.password !== "undefined") {
                if (true === checkEmail(this.email)) {
                    var Objetdata = {
                        email: this.email,
                        password: this.password
                    };
                    LoginFactory.getConnexion(Objetdata).success(function(response) {
                        console.log(response);
                    }).error(function(error) {
                        $ionicPopup.alert({
                            title: 'Error',
                            template: error
                        });
                    });
                    //console.log($scope.items);
                    //$state.go('menu.profil', {});
                } else {
                    $ionicPopup.alert({
                        title: 'Error',
                        template: 'E-mail is not Valide !'
                    });
                }
            } else {
                $ionicPopup.alert({
                    title: 'Error',
                    template: 'E-mail or Password is Empty !'
                });
            }
        };
    }
])

相关文章：