ViewModel 이벤트 패턴을 만드는 방법

Knockout.js를 사용하여 웹 응용 프로그램을 만들었지 만 구현에 실패한 한 가지는 적절한 재사용 가능한 HTML입니다. 지금은 여러 다른보기에서 공유되는 대화 상자와 같은보기가 있더라도 HTML 코드를 복사하여 붙여 넣기 만하면 부모와 자식 사이에 적절한 바인딩 통신이 이루어집니다. 내가 모달 DIV의의 DataContext로 설정하고 하위 뷰 모델이이 경우ViewModel 이벤트 패턴을 만드는 방법

<div class="person-view"> <!-- PersonViewModel --> 
    <div class="person-details"> 
     <!-- Person details --> 
    </div> 
    <button type="button" data-bind="click: EditAddress">Edit address</button> 
    <div class="modal hide fade" role="dialog" data-bind="modal: ShowEditAddressModal, with: Address"> <!-- AddressViewModel --> 
     <div class="modal-header"> 
      <h3>Edit address</h3> 
     </div> 
     <div class="modal-body"> 
      <!-- Address details --> 
     </div> 
     <div class="modal-footer"> 
      <button class="btn" data-dismiss="modal">Cancel</button> 
      <button class="btn btn-danger" data-dismiss="modal" data-bind="click: function() { $parent.SetAddress($data); }">Save</button> 
     </div> 
    </div> 
</div>

다음은 예입니다. 사용자가 저장 단추를 클릭하면 부모 DataContext에서 메서드를 호출합니다.

모달을 별도의 HTML 템플릿으로 분해하고 ViewModel에 동적으로 템플릿을 생성하는 방법을 알고 있습니다. 단순히 부모의 코드 내에서 다음을 수행 할 필요가 있기 때문 보여주는 모달을 숨기기 위해 일할 것입니다 : 모달은 단순히 그 자체에 속성의 가시성을 결합하는 것이 경우

this.Address().IsShown(true);

부모는 단지 그것을 바꿀 필요가 있습니다. 괜찮아.

그러나 내가 클릭했을 때는 버튼을 저장 하시겠습니까? Knockout.js의 MVVM 패턴을 사용하여 부모가이 발생에 응답하는 방법을 알 수 없습니다. 버튼에는 여전히 AddressViewModel의 임의 코드에 바인딩하는 click 바인딩이 필요하지만 Knockout을 사용하여 부모에게 이벤트를 알리는 방법은 무엇입니까?

Knockout으로이를 수행 할 방법이 없으며 이벤트 용 Underscore.js와 같은 별도의 라이브러리를 구현해야합니까?

출처

2013-10-16 Trevor Elliott

아마도 여러분의 뷰/뷰 모델에서 프로토 타이핑을 사용하고 뷰 모델에 대한 콜백을 전달해야 할 것입니다. 그렇게하면 다른 뷰에서 인스턴스를 생성하고 닫을 때마다 부모에게 다시 콜백 할 수 있습니다. –

이것은 사용자의 질문에 대한 직접적인 대답은 아니지만 녹아웃 위에 빌드 된보기 구성을 처리하는 DurandalJS과 같은 라이브러리를 사용하면 해결하려는 문제를 해결할 수 있습니다. Durandal은 휠 재발견없이 코드 재사용을 가능하게하는 많은 기능을 제공합니다. 모든 프로젝트에 적합한 것은 아니지만 필요에 따라 다를 수 있습니다.

출처

2013-10-16 15:09:04 daedalus28

ViewModel 이벤트 패턴을 만드는 방법

답변

관련 문제