development

ko.applyBindings를 호출하여 부분 뷰를 바인딩 할 수 있습니까?

big-blog 2020. 4. 2. 08:16
반응형

ko.applyBindings를 호출하여 부분 뷰를 바인딩 할 수 있습니까?


KnockoutJS를 사용하고 있으며 기본보기 및보기 모델이 있습니다. 별도의 자식보기 모델을 바인딩 할 다른보기로 대화 상자 (jQuery UI 하나)를 원합니다.

대화 상자 내용의 HTML은 AJAX를 사용하여 검색되므로 ko.applyBindings요청이 완료되면 호출 할 수 있기를 원하며 하위보기 모델을 대화 상자 div 내부의 ajax를 통해로드 된 HTML 부분에만 바인딩하고 싶습니다.

실제로 가능합니까, 아니면 페이지가 처음로드 된 다음 ko.applyBindings한 번 호출 될 때 모든 뷰와 뷰 모델을로드해야 합니까?


ko.applyBindings 루트로 사용할 DOM 요소 인 두 번째 매개 변수를 승인합니다.

이렇게하면 다음과 같은 작업을 수행 할 수 있습니다.

<div id="one">
  <input data-bind="value: name" />
</div>

<div id="two">
  <input data-bind="value: name" />
</div>

<script type="text/javascript">
  var viewModelA = {
     name: ko.observable("Bob")
  };

  var viewModelB = {
     name: ko.observable("Ted")
  };

  ko.applyBindings(viewModelA, document.getElementById("one"));
  ko.applyBindings(viewModelB, document.getElementById("two"));
</script>

따라서이 기술을 사용하여 viewModel을 대화 상자에로드하는 동적 컨텐츠에 바인딩 할 수 있습니다. 전반적으로 applyBindings여러 이벤트 핸들러가 연결되므로 동일한 요소에서 여러 번 호출하지 않도록주의하고 싶습니다 .


Niemeyer의 답변이 질문에 대한 더 정확한 답변이지만 다음을 수행 수도 있습니다.

<div>
  <input data-bind="value: VMA.name" />
</div>

<div>
  <input data-bind="value: VMB.name" />
</div>

<script type="text/javascript">
  var viewModels = {
     VMA: {name: ko.observable("Bob")},
     VMB: {name: ko.observable("Ted")}
  };

  ko.applyBindings(viewModels);
</script>

즉, DOM 요소를 지정할 필요가 없으며 다음과 같이 여러 모델을 동일한 요소에 바인딩 할 수도 있습니다.

<div>
  <input data-bind="value: VMA.name() + ' and ' + VMB.name()" />
</div>

런타임에 사용자 지정 모델을 요소에 바인딩했습니다. 코드는 다음과 같습니다. http://jsfiddle.net/ZiglioNZ/tzD4T/457/

흥미로운 것은 데이터 바인딩 속성을 내가 정의하지 않은 요소에 적용한다는 것입니다.

    var handle = slider.slider().find(".ui-slider-handle").first();
    $(handle).attr("data-bind", "tooltip: viewModel.value");
    ko.applyBindings(viewModel.value, $(handle)[0]);

with바인딩뿐만 아니라 http://knockoutjs.com/documentation/custom-bindings-controlling-descendant-bindings.html을 봐야합니다.controlsDescendantBindings

참고 URL : https://stackoverflow.com/questions/7342814/can-you-call-ko-applybindings-to-bind-a-partial-view

반응형