如何在ko.observableArray()中使用自定义绑定 [英] How to use custom binding with ko.observableArray()
问题描述
敲除自定义绑定如何与observableArray一起使用?当使用带有自定义绑定的ko.observable()时，一切都会按预期进行.使用ko.observableArray()时，仅引发初始事件(初始化和更新一次)，但未检测到进一步的更改(请参见
How does knockout custom binding work with observableArray? When using ko.observable() with custom binding, everything works as expected. When using ko.observableArray(), only the initial events (init and update once) are thrown, but further changes are not detected (see Fiddle or code below).
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript" src="knockout-2.2.1.js"> </script>
</head>
<body>
<div data-bind="text: Observable, updateBinding: Observable"></div>
<div data-bind="foreach: ObservableArray, updateBinding: ObservableArray">
<span data-bind="text: $data"></span>
</div>
<script type="text/javascript">
ko.bindingHandlers['updateBinding'] = {
init: function (element, valueAccessor, allBindingsAccessor, viewModel, bindingContext) {
alert("Binding Handler (Init)");
},
update: function (element, valueAccessor, allBindingsAccessor, viewModel, bindingContext) {
alert("Binding Handler (Update)");
}
};
function ViewModel() {
var self = this;
self.ObservableArray = ko.observableArray();
self.Observable = ko.observable();
}
var viewModel = new ViewModel();
// Fires Init + Update for Observable and ObservableArray
ko.applyBindings(viewModel);
// Fires Update for Observable
viewModel.Observable(1);
// Does nothing
viewModel.ObservableArray.push('1');
</script>
</body>
</html>
推荐答案
您将要在自定义绑定中创建对observableArray的依赖项.因此，至少像这样:
You will want to create a dependency on your observableArray within your custom binding. So, at the very least something like:
ko.bindingHandlers.updateBinding = {
init: function (element, valueAccessor, allBindingsAccessor, viewModel, bindingContext) {
alert("Binding Handler (Init)");
},
update: function (element, valueAccessor, allBindingsAccessor, viewModel, bindingContext) {
//create a dependency, normally you would do something with 'data'
var data = ko.utils.unwrapObservable(valueAccessor());
alert("Binding Handler (Update)");
}
};
之所以可以使用您的可观察示例，是因为单个元素上的所有绑定一起触发(更多信息
The reason that this works with your observable example is because all bindings on a single element are triggered together (more info here).
在其他绑定上此行为不相同的原因是foreach的行为不同.对observableArray的更改不会直接触发foreach绑定(否则整个部分将被重新呈现).相反，它在单独的ko.compute中触发逻辑，该ko.computed可评估数组的变化方式并进行必要的增量更新(添加项目，删除项目等).
The reason that this does not behave the same way on your other binding is that foreach behaves differently. Changes to the observableArray do not trigger the foreach binding directly (or the whole section would be re-rendered). Instead it triggers logic in a separate ko.computed that evaluates how the array has changed and makes the necessary incremental updates (add an item, remove an item, etc.).
这篇关于如何在ko.observableArray()中使用自定义绑定的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
