2015-10-08 94 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 !' 
 
       }); 
 
      } 
 
     }; 
 
    } 
 
])