4

表示されているバインディングを切り替えたり、「foreach」バインディングのbeforeRemoveイベントを使用したりするときに、jqueryエフェクトを追加する方法については、knockout.jsのドキュメントに例があります。

ただし、「if」バインディングを切り替えるときにjquery効果を追加する方法がわかりません。

次のコードを検討してください。

<table data-bind="with: myModel">
 <tr data-bind="if: IsVisible">
<td>some string</td>
 </tr>
</table>

IsVisibleがtrueを返したときにjqueryfadeInエフェクトを追加するにはどうすればよいですか？

4

1 に答える 1

6

バインディングを直接使用することはできませんが、ifバインディング内でカスタムバインディングを使用するifと、次のようなトリックが実行されます。

<table data-bind="with: myModel">
    <tr data-bind="if: IsVisible">
        <!--ko fadeIn: true-->
        <td>some string</td>
        <!--/ko-->
    </tr>
</table>

ハンドラ：

ko.bindingHandlers.fadeIn = {
    init: function(element) {
        $(ko.virtualElements.childNodes(element))
            .filter(function () { return this.nodeType == 1; })
            .hide()
            .fadeIn();
    }
};
ko.virtualElements.allowedBindings.fadeIn = true;

例： http： //jsfiddle.net/mbest/fpnTH/

于 2013-03-19T21:33:57.230 に答える