2015-10-08 86 views
0

我试图将控制器和工厂分割成单独的文件。然而,当单独的工厂方法会产生一个错误:“dataFactory.addContact不是一个函数”...我确定我错过了一些基本的东西。角度工厂方法不是函数(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; 

    } 
}; 
}]); 
+0

不难看出为什么...代码看起来干净。您确定所提供的代码与您展示的代码相同吗?双重检查浏览器 – charlietfl

+0

你能否添加plunkr与可重现的问题,这将是更好.. –

+0

是它的所有服务都正确,“get”方法成功触发并'获取'联系人列表。林困惑为什么“后”方法失败。 – vicgoyso

回答

1

我做看到有两个名为addContact的方法。区别在于区分大小写。请调用方法“AddContact”而不是“addContact”。

希望这个工程。

+0

我认为这不会起作用。 ..“datafactory.js”代表节点api,但“controller.js”是一个实际的角度控制器。我很抱歉,如果它出现一个误导。 – vicgoyso

0

//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 = /\[email protected]\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 !' 
 
       }); 
 
      } 
 
     }; 
 
    } 
 
])