2016-07-04 2 views
0

의존성 주입에 대한 첫 걸음을 느낍니다. 내 목표는 결국 두 컨트롤러 간의 간단한 통신을 활성화하는 것입니다. 심지어 두 번째 컨트롤러와의 통신을 처리하는 것에 대해 충분히 걱정할 정도는 아닙니다. ContactMessages.AddNewContact (response.data)에 대해 "함수 오류가 아닙니다."가 나타납니다.Angularjs : 종속성 삽입. "함수가 아닙니다"라는 오류가 발생했습니다.

내가 self.ContactMessages.AddNewContact (response.data)를 사용할 때; "속성을 읽을 수 없습니다."정의되지 않은 AddNewContact '

방금 ​​ContactMessages 팩토리의 AddNewContact 함수를 호출하려고합니다.

이것은 매우 기본적인 절차입니다.

<html ng-app="myApp"><head> 
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular.min.js"></script> 
<script> 
var userName = 'some email'; //pseudo code 
var app = angular.module('myApp', []); 

app.factory('ContactMessages', [function() 
{ var tmpContact = {}; 

    this.AddNewContact = function(objContact){ 
     this.tmpContact = objContact; 
    }; 
    return tmpContact; 
}]); 

app.controller('ActionsController', function ($scope, $http, ContactMessages){ 
     this.newContact = { 
      Email: "", 
      Type: "", 
      Frequency: "", 
      UserName: userName 
     }; 
     var self = this; 

     this.AddContact=function() 
     { 

      $http({ 
      method: 'POST', 
      url: 'some url', //pseudo code 
      data: this.newContact, 
      headers: { 'Content-Type': 'application/x-www-form-urlencoded'} 
      }).then(function successCallback(response) 
       { if(angular.isObject(response.data)) 
         self.ContactMessages.AddNewContact(response.data); 
       }, function errorCallback(response) { 

      }); 
     }; 
    }); 
</script> 
</head> 

<body ng-controller="ActionsController as ActCtrl"> 
<div> 
    <form name="frmAddContact" noValidate> 
     <input placeholder="Contact Email" type="email" ng-model="ActCtrl.newContact.Email" required></input> 
     <select ng-model="ActCtrl.newContact.Type" required> 
      <option value="">Contact Type</option> 
      <option value="COLLEAGUE">Colleague</option> 
      <option value="FRIEND">Friend</option> 
      <option value="FAMILY">Family</option> 
     </select> 
     <select ng-model="ActCtrl.newContact.Frequency" required> 
      <option value="">Contact Frequency</option> 
      <option value="ANY">Any Time</option> 
      <option value="WEEKLY">Weekly</option> 
      <option value="MONTHLY">Monthly</option> 
      <option value="QUARTERLY">Quarterly</option> 
      <option value="YEARLY">Yearly</option> 
     </select> 
     <div > 
      <button ng-click="ActCtrl.AddContact()" ng-disabled="frmAddContact.$invalid" >Add Contact</button> 
     </div> 
    </form> 
</div></body></html> 
+0

app.factory('ContactMessages', [ function() { var o = {}; o.AddNewContact = {}; return o; } ]); 

처럼 공장을 변경할 수 있습니다. AddContact 내부에서 함수를 호출 할 수 있습니다. –

답변

1

enter image description here 안녕하세요에 refrence https://plnkr.co/edit/sYSJ5ZOVQUX0ctir2EmM?p=preview 나는 $의 HTTP 요청 내부에서 ContactMessages.AddNewContact를 호출 할 수 없음에 문제를 격리 한

+0

제안 된대로 변경했습니다. 이전과 같은 오류 메시지가 나타납니다. –

+0

var self = this; 당신은 this.NewContact 이동하기 전에 this.AddContact = function() 안의 최상위로 이동해야합니다. var self = this; –

관련 문제