次のようなビューモデルがあります。
self.selectedItems = ko.observableArray();
self.onBeforeUnselectItem = function (elem) {
if (elem.nodeType === 1)
$(elem).fadeOut(function() {
$(elem).remove();
});
};
self.unselectItem = function (item) {
self.selectedItems.remove(item);
self.unSelectedItems.push(item);
};
私の見解は次のようになります。
<div data-bind="foreach: {data: selectedItems, beforeRemove: onBeforeUnselectItem}">
<span data-bind="text: Name"></span> - <a href="#" data-bind="">Remove</a>
</div>
unSelectedItems
私の問題は、フェードアウト アニメーションが終了する前に項目が押し込まれていることです。
unselectItem
アニメーションが終了するまで待機するように呼び出す方法はありますか?
これは、クリックイベントがバインドされている方法が原因であることに気付きましたunselectItem
編集
とりあえず、unselectItem
関数に遅延を入れます:
(これは明らかに理想的ではありません!)
self.unselectItem = function (item) {
self.selectedItems.remove(item);
setTimeout(function () {
self.unSelectedItems.push(item);
}, 350);
};