我正在尝试将可观察对象的创建封装在自定义绑定中,就像 knockoutjs-validation 的 isValid 一样,但不扩展绑定,因为将来此属性将是另一个绑定的结果,该绑定记录了一个复杂的事件序列输入,感觉除了为此使用自定义绑定之外我不应该做更多的事情。
以下代码显示了我负责创建 observable 的自定义绑定。
ko.bindingHandlers.myBinding = {
init: function (
element, valueAccessor, allBindingsAccessor,
viewModel, bindingContext) {
console.log("init myBinding");
var observable = valueAccessor();
observable.IsRed = ko.observable(true);
console.log("isred created");
ko.applyBindingsToNode(element, {
value: observable,
mySubBinding: observable.IsRed
}, viewModel);
console.log("finish myBinding");
},
update: function (
element, valueAccessor, allBindingsAccessor,
viewModel, bindingContext) {
console.log("update myBinding");
}
};
我遇到的问题是 observable 似乎是在执行 applyBindings 命令的一部分之后创建的,并且只有 View 上的后绑定才能看到 observable 的正确值。
我写了一个 jsfiddle 来展示这种行为。其中,IsRed
是有问题的可观察对象。
http://jsfiddle.net/ricardomp/c2HnJ/15/
预期的结果将是具有红色背景的输入和具有相同值之前和之后的跨度标签。
我能做些什么来实现这个结果?结果绑定不应该依赖于任何外部可观察对象或属性,对吗?您会提出替代实施方案吗?
提前致谢。
更新:
我认为值得一提的是,myBinding 是一个封装了多个绑定的绑定。所以,像 IsRed 一样,我将有 3 或 4 个绑定分配给类似的可观察对象。
最后更新:
在 RP 的回答之后,我编写了以下代码来完成 observables 的初始化:
ko.observable.fn.colorStatus = function () {
this.isRed = ko.observable();
this.isGreen = ko.observable();
this.isBlue = ko.observable();
this.ResetStatus = (function () {
this.isRed (undefined);
this.isGreen (undefined);
this.isBlue (undefined);
}).bind(this);
return this;
};
之后,我只需要在初始化时调用我的 observable 上的 colorStatus 即可。
self.value = ko.observable().colorStatus();
就这样。