2016-07-05 4 views
-1

부모와 자식 컨트롤러 관계가 있습니다. 이것은 기본 기능의 작동하지 않는 모형입니다. 나는 Plunker 또는 Fiddle 모델에서 저보다 유능한 사람이 일할 수 있다고 확신합니다. (따라서 아마도 뭔가 잘못된 것일 수 있습니다 : $ scope.data.contactList = [{ID : 1, Email : "[email protected]"}, {ID : 2, Email : "[email protected]"}] ;) 나는 contactList 배열에 대한 몇 가지 객체를 만들려고했다.Angularjs : ng-model이 제대로 표시되지 않습니다.

어쨌든. EditShowContact를 호출하려면 아래 코드의 두 번째 테이블에있는 링크를 클릭 할 수 있어야합니다. 내 실제 애플 리케이션에서, 이것은 숨겨진 div를 표시하고 그것은 분명히 이메일보다 연락처의 더 많은 속성을 표시합니다.

내 실제 프로그램에서 테이블의 값이 제대로 채워져 있습니다. 즉, ng-repeat 지시어가 제대로 작동합니다.하지만 ng-model 지시문이 응답하지 않는 것 같습니다. 나는 다양한 방법을 시도했지만 아무 것도 작동하지 않는 것 같습니다.

ContactsCtrlContactList에 대한 정보가 없습니다 :

<html ng-app="myApp"><head> 
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular.min.js"></script> 
<script> 

var app = angular.module('myApp', []); 

app.controller('ContactsController', function ($scope) 
{ 
    this.currentContactID = null; 
    this.EditShowContact = function(intContactID) 
    { 
     this.currentContactID = intContactID; 
     //this.currentContact = $scope.data.contactList[intContactID]; unclear why this assignment fails 
    }; 
}); 

app.controller('ActionsController', function ($scope) 
{ $scope.data = {}; 
    $scope.data.contactList = [{ID: 1, Email: "[email protected]"}, {ID: 2, Email: "[email protected]"}];  
}); 

</script> 
</head> 
<body ng-controller="ActionsController as ActCtrl"> 

<div ng-controller="ContactsController as ContactsCtrl"> 
    <table border = "1";> 
     <tr><th>Email</a></th> 
      <th>Name</th></tr> 
    </table> 
    <div > 
     <table ng-repeat="Contact in ContactsCtrl.data.contactList" border="1"> 
      <tr> 
       <td><a href="" ng-click="ContactsCtrl.EditShowContact(Contact.ID)" style="padding-left: 5px;">{{Contact.Email}}</a></td> 
       <td>{{Contact.Name}}</td> 
      </tr> 
     </table> 
    </div> 
    <div> 
     <form> 
      <input type="input" ng-model="ContactsCtrl.data.contactList[currentContactID].Email"></input> 
     </form> 
    </div> 
</div> 
</body> 
</html> 

답변

1

같은 여기 꽤 몇 가지 오류가 있습니다. 당신은

Bascially .. <div>보다 내부 <table> 요소를 사용하여 index에 장소에 ID를 사용하여 배열의 객체를 찾기 위해 노력하고있다, 난 하나에 두 개의 컨트롤러의 필요성을 절감하고 Working Demo을 만들었습니다.

+0

Nevermind. 나는 당신의 도움으로 내 엄청난 감독을 알아 냈다. 전체 프로그램에서 ContactList의 존재하지 않는 색인을 참조하기 위해 Contact.ID를 사용했습니다. 데모 코드에서 ID와 인덱스가 일치하는 경우가 발생했습니다. 그게 내 과제가 왜 실패했는지 설명해줍니다. –