0

http://jsfiddle.net/scottbeeson/SRUKN/24/

これを使用して新しいdivを作成しています：

$("<div/>", {
    class: "itemView",
    id: name,
    "data-bind": "template: { name: 'tmplItemView' }"
}).appendTo("body")

テンプレートには適切なデータバインドがあります

<script type="text/html" id="tmplItemView">
    <div class="itemHeader" data-bind="text: name">Item Name</div>
    <span id="itemClose" class="closeWindow"><i class="icon-remove">X</i></span>
</script>

しかし、作成をトリガーすると、DOM に空の div が作成されます。その後すぐにバインディングを適用すると、テンプレートは正しく機能しているように見えますが (つまり、DIV は空ではありません)、ビューモデル全体がクリアされます。

私は以前にこれを扱っていましたが、今の違いは、ノックアウトのクリックバインディングを使用する代わりに、jquery 関数を使用してクリックをキャッチしていることだと思います。

4

1 に答える 1

1

私は見て、回避策を見つけました。参照: http://jsfiddle.net/SRUKN/26/

function createItemDiv(item) {
    console.log('Creating div from template');
    var $el = $("<div/>", {
        class: "itemView",
        id: item.name(),
        "data-bind": "template: { name: 'tmplItemView' }"
    });
    $el.appendTo("body");
    $el.draggable();
    ko.applyBindings(item, $el.get(0));
}

基本的には、applyBindingsバインド先の VM と対象の要素の両方を渡すことで、呼び出しがより対象となるようにしているだけです。

于 2013-06-12T22:52:50.943 に答える