KnockoutJS custom bindings 요소에 자식이 있나요?

Question

기존 값을 가져 와서 뷰 모델에 삽입하는 사용자 지정 바인딩 작업 중입니다. 그러나 ko.bindingHandlers에 제공된 요소에 하위 요소가없는 것 같은 장애물이 있습니다.

KnockoutJS에서 어떻게 작동합니까? 아니면 뭔가 빠졌습니까? 여기

내 HTML 마크 업입니다 :

<div data-bind="with: person, useInitValueFor: ['firstName', 'lastName']"> 
    <div data-bind="text: firstName">John</div> 
    <div data-bind="text: lastName">Doe</div> 
</div> 

그리고 여기 내 JS 코드입니다 :

이

ko.bindingHandlers.useInitValueFor = { 
    init: function(element, valueAccessor, allBindingsAccessor, viewModel, bindingContext) { 
     var $elem = $(element); 
     var value = ko.utils.unwrapObservable(valueAccessor()); 
     var allBindings = allBindingsAccessor(); 

     for (var i = 0; i < value.length; i++) { 
      var c = value[i]; 
      var e = $elem.children('[data-bind*="' + c + '"]:first'); 
      alert(e.length); // This gives me 0 
      if (e.length > 0) { 
       var a = e.attr('data-bind').split(','); 
       for (var j = 0; j < a.length; j++) { 
        var b = a[j].split(':'); 

        switch (b[0]) { 
         case 'text': 
          allBindings.with[c](b[1]); 
          alert(allBindings.with[c]()); 
          break; 
        } 
       } 
      } 
     } 
    } 
}; 

function personViewModel() { 
    this.person = { 
     firstName: ko.observable(), 
     lastName: ko.observable() 
    }; 
} 

$(document).ready(function() { 
    var vm = new personViewModel(); 
    ko.applyBindings(vm); 
}); 

당신은 또한 jsFiddle에 여기를 볼 수 있습니다 다음 with의 http://jsfiddle.net/dzul1983/XjD3Y/1/

Answer 1

init 함수 바인딩은 요소의 자식에서 "템플릿"으로 사용할 복사본을 만듭니다. update 부분은 해당 "템플릿"에 대해 현재 데이터를 적용합니다.

바인딩 코드가 실행될 때 바로 with 바인딩의 init과 update 사이에 있습니다.

당신을위한 해결책 중 하나는 with 바인딩 전에 바인딩을 나열하는 것입니다.