0

조금 늦기는하지만 이것을 철저히 설명하려고합니다.지시어에서 값을 ng-model으로 다시 전달

드롭 다운을 기반으로하는 많은 입력 필드가있는 지시문을 만듭니다. 필자는 기본적으로 부모에게 전달하려는 사용자 지정 옵션을 만들고 있습니다. 호출 템플릿의 ng-model 값을 지시문에 전달합니다. 나는 커스터마이징 된 옵션의 값을 가져 와서 그 지시어의 ng-model의 값으로 되돌리고 싶습니다. 이 코드를 보면

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

당신이 다음 페이지에 입력이있는 HTML 파일에서 볼 수 있습니다

나는 내가 할 시도하고있는 무슨과 plunker 설정을 지시어를 호출합니다. 입력 값은 객체 name.first의 값을 사용합니다. 지시문은 값 name.test을 사용합니다. 지시문에 추가 입력 필드가있는 템플릿이 있습니다. 이 내부 입력 필드에서 값을 가져 와서 값을 name.test 값으로 다시 전달하려고합니다. 이제 지시문 입력의 ng-model을 전달 된 ngModel 값으로 설정할 수 있음을 알고 있습니다. 그러나 이것은 간단한 예제 일 뿐이며 실제 코드에서는 추가 확인란과 라디오 요소를 갖게 될 것입니다. 개체로 모여 다시 ng-model으로 전달하십시오. 작동하면 버튼을 클릭하면 { first: 'Felipe', test: { new_value: 'My Inner Value' } }과 같은 개체가 기록됩니다.

+0

는이 http://plnkr.co/edit/uWdYNnwQ0kxMzmtD4tqf?p=preview 같은 기대하고 해결해야합니까? – Asik

+0

아닙니다. 질문을 보면 예상 결과의 형식이 마지막 줄에 있습니다. 예제에서 콘솔을 보면 태스크 변수는 여전히 'first' 속성 만 갖고 있습니다. –

답변

0

지시어에 ng-model을 사용하면 지시문의 입력 모델과 입력 태그가 동일하지 않으므로 약간 혼란 스럽습니다. 내가 제대로 문제를 이해한다면

는, 다음은

app.directive('myDirective', function($compile) { 
    return { 
    restrict: 'E', 
    scope: { 
     newModel: '=ngModel' 
    }, 
    template: '<div class="some">' + 
     '<p ng-bind="newModel"></p><input ng-model="newModel.new_value"></div>', 
    replace: true, 
    require: '?ngModel' 
    }; 
}); 
+0

예! 그것이 바로 그 것이다. 나는 객체를 생성하고 지시문의 링크 함수에 객체를 할당하려고 시도하여 그것을 지나치게 생각했다. –