Knockout BeforeRemove returns textNode 不是 elementNode
Knockout BeforeRemove returns textNode not elementNode
使用 Knockout 的 foreach 绑定时,我试图在将项目添加到列表时复制分类黄色渐变。 (来自 Here)
这是我的代码
<div id="minicartItems" data-bind="template: { foreach: DisplayItems, beforeRemove: ElementFadeOut, afterAdd: ElementFadeIn }">
<div data-bind="attr: { id: 'sideCartItm' + $index() }">
<!-- ko if: IsFleet() -->
<!-- DO STUFF -->
<!-- /ko -->
<!-- ko ifnot: IsFleet() -->
<!-- DO STUFF -->
<!-- /ko -->
</div>
</div>
在我的虚拟机中:
self.ElementFadeOut = function (element, index, data) {
$(element).fadeOut();
// $(element.id).fadeOut(); ADDING .ID doesnt work either because its text node.
}
self.ElementFadeIn = function (element, index, data) {
$(element)
.animate({ backgroundColor: 'yellow' }, 200)
.animate({ backgroundColor: 'white' }, 800);
}
但是,在添加或删除项目时,我在控制台上遇到错误(并且没有发生淡入淡出)。
jquery-1.8.3.min.js:2 Uncaught TypeError: Failed to execute 'getComputedStyle' on 'Window': parameter 1 is not of type 'Element'.
at Dt (jquery-1.8.3.min.js:2)
at Function.css (jquery-1.8.3.min.js:2)
at Gt (jquery-1.8.3.min.js:2)
at Object.Gn (jquery-1.8.3.min.js:2)
at Kn (jquery-1.8.3.min.js:2)
at Text.o (jquery-1.8.3.min.js:2)
at Function.dequeue (jquery-1.8.3.min.js:2)
at Text.<anonymous> (jquery-1.8.3.min.js:2)
at Function.each (jquery-1.8.3.min.js:2)
at init.each (jquery-1.8.3.min.js:2)
根据我的调查,element
参数似乎不是元素类型,而是文本节点类型。
这是调试器中 element
的快照:
如果我展开 parentNode
然后 child nodes
我可以看到有文本和 div 节点,但我不确定为什么。
如何获得发送元素节点而不是文本节点的函数?
使用 afterRender
而不是 afterAdd
是解决方案 - DOM 元素在呈现之前无法添加! http://knockoutjs.com/documentation/template-binding.html#note-4-using-afterrender-afteradd-and-beforeremove
使用 Knockout 的 foreach 绑定时,我试图在将项目添加到列表时复制分类黄色渐变。 (来自 Here)
这是我的代码
<div id="minicartItems" data-bind="template: { foreach: DisplayItems, beforeRemove: ElementFadeOut, afterAdd: ElementFadeIn }">
<div data-bind="attr: { id: 'sideCartItm' + $index() }">
<!-- ko if: IsFleet() -->
<!-- DO STUFF -->
<!-- /ko -->
<!-- ko ifnot: IsFleet() -->
<!-- DO STUFF -->
<!-- /ko -->
</div>
</div>
在我的虚拟机中:
self.ElementFadeOut = function (element, index, data) {
$(element).fadeOut();
// $(element.id).fadeOut(); ADDING .ID doesnt work either because its text node.
}
self.ElementFadeIn = function (element, index, data) {
$(element)
.animate({ backgroundColor: 'yellow' }, 200)
.animate({ backgroundColor: 'white' }, 800);
}
但是,在添加或删除项目时,我在控制台上遇到错误(并且没有发生淡入淡出)。
jquery-1.8.3.min.js:2 Uncaught TypeError: Failed to execute 'getComputedStyle' on 'Window': parameter 1 is not of type 'Element'.
at Dt (jquery-1.8.3.min.js:2)
at Function.css (jquery-1.8.3.min.js:2)
at Gt (jquery-1.8.3.min.js:2)
at Object.Gn (jquery-1.8.3.min.js:2)
at Kn (jquery-1.8.3.min.js:2)
at Text.o (jquery-1.8.3.min.js:2)
at Function.dequeue (jquery-1.8.3.min.js:2)
at Text.<anonymous> (jquery-1.8.3.min.js:2)
at Function.each (jquery-1.8.3.min.js:2)
at init.each (jquery-1.8.3.min.js:2)
根据我的调查,element
参数似乎不是元素类型,而是文本节点类型。
这是调试器中 element
的快照:
如果我展开 parentNode
然后 child nodes
我可以看到有文本和 div 节点,但我不确定为什么。
如何获得发送元素节点而不是文本节点的函数?
使用 afterRender
而不是 afterAdd
是解决方案 - DOM 元素在呈现之前无法添加! http://knockoutjs.com/documentation/template-binding.html#note-4-using-afterrender-afteradd-and-beforeremove