knockout.js - 折りたたみ可能な項目を再度開いたときに、jquery モバイルの折りたたみ可能なセットで複数のバインドの問題を解決する

Question

jQueryモバイルを使用してツリー構造を構築し、collapsible-set折りたたみ展開イベントでツリーのさまざまなレベルにデータをバインドしています。

データバインディングは完全に正常に機能していますが、ユーザーがツリーを再度開くと、再びバインディングが発生して発生しmultiple binding errorます。

これを回避する方法は？私は試しcleanNodeてみました!!ko.dataFor。何も機能していません..

以下は私のコードです。一部のノード バインディングをクリックした場合にのみ、そのセクションにのみ適用する必要があるため、ストップ バインディングを使用しています。

HTML

<div id="tree"  data-role="collapsible-set" data-collapsed-icon="carat-d" 
     data-expanded-icon="carat-u" data-iconpos="right" 
     data-bind="foreach:FolderObject">             
    <div data-role="collapsible" class="Folder" data-inset="false"
         data-bind="attr:{'id':$index()}">
        <span style="margin-left:10px;" data-bind="text:DisplayName"></span>
            <!--Subtree-->
        <div data-bind="attr:{'id':'Jobs'+$index()} ">
        <!-- ko stopBinding: true -->
            <div data-bind="foreach:SubTreeObject" data-role="collapsible-set">
                <div data-role="collapsible" class="JobFolder" data-inset="false"
                     data-bind="attr:{'id':$index()}">
                    <span style="margin-left:10px;" data-bind="text:DisplayName">
                    </span>
                </div>   
            </div>
        <--/ko-->   
        </div> 
    </div>
</div>

JS

$('#tree').on('collapsibleexpand', '.Folder', function (evt) {  
    var id=this.id;
    var x = $('#Jobs' + id + ' ' + 'div[data-role="collapsible-set"]');
    ko.applyBindings(VM2, x[0]); // VM2 has 'SubTreeObject' data
});