淘汰赛自定义绑定处理程序和自定义jQuery UI部件
问题描述:
我想创建一个自定义淘汰赛bindingHandler来添加自定义jQuery UI部件,但遇到麻烦试图访问绑定过程中创建的元素。我确信这是我失踪的根本原因。我有以下的html:淘汰赛自定义绑定处理程序和自定义jQuery UI部件
<table data-bind="myGrid: {}">
<thead>
<tr data-bind="foreach: { data: columns, as: 'column' }">
<th data-bind="text: column"></th>
</tr>
</thead>
<tbody data-bind="foreach: { data: rows, as: 'row' }">
<tr data-bind="foreach: { data: $parent.columns, as: 'column' }">
<td data-bind="text: row[column]"></td>
</tr>
</tbody>
</table>
而且下面的JavaScript:
var vm = {
columns: [
'A', 'B'
],
rows: []
};
$.widget("my.grid", {
_create: function() {
var columns = this.element.find('th');
}
});
ko.bindingHandlers.myGrid = {
init: function (element) {
//$(element).grid();
},
update: function(element) {
$(element).grid();
}
};
ko.applyBindings(vm);
当创建的小部件,它需要找到各次从绑定创建的元素。但是,这些元素似乎并未在此时创建。我已经尝试了绑定处理程序的init和update方法。
这个工程,如果我手动添加小部件到元素,只是不在绑定处理程序。
何时以及如何访问通过数据绑定创建的元素,以便我的jQuery小部件可以修改它们?
答
您需要控制绑定到您的自定义绑定处理程序中的后代元素。
见http://knockoutjs.com/documentation/custom-bindings-controlling-descendant-bindings.html
但基本上,做这样的事情:
ko.bindingHandlers.myGrid = {
init: function (element, valueAccessor, allBindingsAccessor, viewModel, bindingContext) {
// bind our child elements (which will create the virtual foreach elements)
ko.applyBindingsToDescendants(bindingContext, element);
// make your grid widget
$(element).grid();
// tell KO we have already bound the children
return { controlsDescendantBindings: true };
},
update: function() { ... }
};
是啊,发现我发布之后。谢谢。 – 2013-05-13 22:18:01