2013-12-16 3 views
0

두 개의 다중 선택 위젯을 동기화 상태로 유지하려고하지만 한 방향으로 만 동작을 가져올 수 있습니다.문제 바인딩 모델에 대한 각도 맞춤 지시문

하나의 위젯이 메인 페이지에 있고 다른 하나는 각도 ui 부트 스트랩 모달입니다. 두 가지 다중 선택 위젯은 사용자 정의 지정 문을 사용하여 작성됩니다. 지시문의 각 인스턴스는 다른 컨트롤러 (MainCtrl 및 ModalCtrl)에 바인딩됩니다. 지시어의 각 인스턴스의 "selected"속성은 해당 컨트롤러의 범위 변수에 바인딩되며, 해당 변수는 모델의 동일한 getter 메서드 (getSelectedFilters)에 차례로 바인딩됩니다.

기본 페이지에서 위젯의 선택을 변경하면 변경 사항이 모달 패널의 위젯에 반영됩니다. 그러나 모달 패널에서 선택 항목을 변경하면 모델이 올바르게 업데이트 된 경우에도 변경 사항이 기본 페이지의 위젯에 반영되지 않습니다 (위젯이 "현재 선택됨"버튼은 올바른 선택을 표시합니다. 하지 않는다). 차이점을 전혀 이해하지 못합니다.

여기 내 문제를 설명하는 벗겨 낸 plnkr입니다.

http://plnkr.co/edit/nC5bkGFE4LkYZsaxdjL7?p=preview

나는 각도에 완전히 새로운 오전, 메인 페이지에 내 지시가 업데이트되지 않는 이유에 대한 모든 입력을 부탁드립니다 제대로 때 모델의 데이터가 변경.

+0

플 런커를 시험해 보면 업데이트가 양방향으로 작동하는 것 같습니다. 기본 페이지에 직접 추가 할 수는 없지만 기본 페이지의 요소를 제거하면 모달에 반영되고 모달에 추가되는 내용은 기본 페이지에 반영됩니다. –

+0

예, 제 잘못입니다. 나는 내 질문을 게시 한 후 친구가 그걸 가지고 놀게했다. 그는 내 문제를 해결했다. jfiddle보다는 plnkr을 처음 사용합니다. jfiddle처럼 링크를 변경하지 않고도 업데이트가 자동으로 표시된다는 것을 알면 좋습니다! 나는 곧 답변을 게시 할 것이다. – Emilie

+0

(버전 7은 내가 처음 게시 한 것입니다) – Emilie

답변

0

plnkr의 버전 7은 내가 처음 게시 한 버전입니다.

기본적으로 값이 변경 될 때마다 $ scope.selected에 $ apply를 호출하면 다른 지시문에 변경 사항을 알리는 데 충분하지 않습니다.

$scope.$watch('selected', function(newVal, oldVal) { 
    select2.val(newVal).select2(options); 
}); 

내가 지금은 메인 페이지에 선택 2 지시어를 수정 될 때 모달의 선택 2 지시어는 $ 시계없이 모든 업데이트 된 이유에 완전히 확실하지 오전 : 나는 또한 설정에 $ 시계를했다. 누군가가 거기에서 무슨 일이 일어 났는지 설명 할 수 있다면 정말 좋을 것 같습니다! 알고있는 사람이라면 버전 7로 돌아가서 무슨 뜻인지 알아보십시오.