사용자 지정 바인딩이 업데이트를 실행하지 않습니다.

Question

Knockout.js와 Jquery Mobile UI 조합을 사용하는 시스템에서 작업하고 있습니다. 내가 겪었던 문제 중 하나는 knockout :if 바인딩을 가진 요소에 Jquery Mobile을 적용하는 것이 었습니다. 우리가 사용했던 초기 솔루션은 ko.applyBindings 및 ko.valueHasMutated 호출 한 후 이벤트 핸들러에 다음

$(element).find('div[data-onthemovecollapsible="true"]:not(div[data-role="collapsible"])').attr("data-role", "collapsible"); 
$(element).collapsibleset().collapsibleset("refresh"); 

문제는이 때로는 여러 번에 전화를받을 것이다 않았거나 때로는 누군가가 트리거 잊지 것이다 호출 될 때 페이지주기 화재 사건이었다 필요한 이벤트를 반복하고 반복해서 동일한 버그를 생성하므로 비즈니스가이 메커니즘을 다음과 같은 로직으로 사용자 정의 바인딩으로 이동하기로 결정했습니다. 요소가 바인딩 된 경우 (표시되거나 다른 방식으로 끝나는 경우) JQuery 모바일 UI가 적용됩니다. 맞춤 바인딩의 init은 ko.applyBindings 및 update에 해당하는 것입니다. ko.valueHasMutated입니다. 페이지에 '목록'이 나타나면 잘 작동하지만 페이지 매김이나 필터링을 사용하면 모델이 '다시 바인딩'되지 않고 viewModel 배열 만 변경되고 ko.valueHasMutated이 호출되고 있습니다. 방금 값이 변경되었을 때 update이 호출되지 않는다는 것을 알았습니다. 나는 주위에 약간의 독서를 완료하고이 그러나 솔루션 중 누구도 내가 예를 function (element, valueAccessor) {...에서 나에게 많이 사용하지처럼 valueAccessor()에 가입하고있는 경우

ko.bindingHandlers.expandableListJQM = { 
    init: function (element, valueAccessor) { 
     $(element).find('div[data-onthemovecollapsible="true"]:not(div[data-role="collapsible"])').attr("data-role", "collapsible"); 
     $(element).collapsibleset().collapsibleset("refresh"); 
     var val = ko.utils.unwrapObservable(valueAccessor()); 
     if (val!= undefined) { 
      valueAccessor().subscribe(function (element, valueAccessor) { 
       $(element).find('div[data-onthemovecollapsible="true"]:not(div[data-role="collapsible"])').attr("data-role", "collapsible"); 
       $(element).collapsibleset().collapsibleset("refresh"); 
      }); 
     } 
    }, 

    update: function (element, valueAccessor) { 
     $(element).find('div[data-onthemovecollapsible="true"]:not(div[data-role="collapsible"])').attr("data-role", "collapsible"); 
     $(element).collapsibleset().collapsibleset("refresh"); 
    } 
}; 

도 내 경우에는 제대로 작동하지 않는 알려진 문제가 될 것 같다 element으로 전달되는 변수는 빈 배열이며 유용하지는 않습니다.
ID 목록이 무엇인지 알고 있으므로 JQuery 선택기를 사용하여 .collapsibleset().collapsibleset을 적용 할 수는 있지만 적절한 해결책이 아니라고 생각합니다. 이전에 해킹했을 때와 마찬가지입니다.

내가 어떻게knockout.js 사용자 정의 바인딩 update 적절한 인수를 전달 화재 만들 수 있습니까?

Answer 1

당분간 나는 누군가가 그것을 제안 할 것이라는 것을 알고 있기 때문에이 해결책을 사용하고 있습니다. 그러나 이것은 단지 해킹 일 뿐이며 나는 누군가로부터 '적절한'해결책을 선호 할 것입니다.

ko.bindingHandlers.expandableListJQM = { 
    init: function (element, valueAccessor) { 
     $(element).find('div[data-onthemovecollapsible="true"]:not(div[data-role="collapsible"])').attr("data-role", "collapsible"); 
     $(element).collapsibleset().collapsibleset("refresh"); 
     var element = $(element); 
     var val = ko.utils.unwrapObservable(valueAccessor()); 
     if (val!= undefined) { 
      valueAccessor().subscribe(function() { 
       $(element).find('div[data-onthemovecollapsible="true"]:not(div[data-role="collapsible"])').attr("data-role", "collapsible"); 
       $(element).collapsibleset().collapsibleset("refresh"); 
      }); 
     } 
    }, 

    update: function (element, valueAccessor) { 
     $(element).find('div[data-onthemovecollapsible="true"]:not(div[data-role="collapsible"])').attr("data-role", "collapsible"); 
     $(element).collapsibleset().collapsibleset("refresh"); 
    } 
};