我有一个关于customBindings的快速问题,希望有些人可以帮我解释一下?我认为当更新observable时,任何绑定到该observable的customBinding都会调用其"update"方法.我可以看到,当我更新我的observable时,其他订阅者正在收到通知,但似乎并没有调用customBinding.
这是我的viewModel:
var innerModel = {
name: ko.observable('junk')
};
var innerModel2 = {
name: ko.observable('junk2')
};
var viewModel = {
im1: innerModel,
im2: innerModel2,
selectedModel: ko.observable({name:'xxx'})
};
Run Code Online (Sandbox Code Playgroud)
这是我的customBinding:
ko.bindingHandlers.custom = {
update: function(element, valueAccessor) {
console.log("BAM!");
while (element.firstChild)
ko.removeNode(element.firstChild);
ko.renderTemplate('test', valueAccessor(), {}, element, 'replaceNode');
}
};
Run Code Online (Sandbox Code Playgroud)
我的模板只是一个显示"名称"字段的跨度:
<script id='test' type='text/html' charset='utf-8'>
<span data-bind='text: name'></span>
</script>
Run Code Online (Sandbox Code Playgroud)
这是我与customBinding一起使用的HTML:
<div id="container" data-bind="with: viewModel">
<div data-bind="custom: selectedModel">
</div>
</div>
Run Code Online (Sandbox Code Playgroud)
当我将selectedModel更新为两个innerModel中的任何一个时,会显示正确的名称,但不会调用customBinding的'update'函数.我有一个单独的订阅者"selectedModel"observable:
viewModel.selectedModel.subscribe(function(newValue) {
console.log(newValue.name());
});
Run Code Online (Sandbox Code Playgroud)
当我更改selectedModel时调用它,那么为什么不调用customBinding的更新?
这是一个显示问题的jsfiddle:http: //jsfiddle.net/gperng/twAcJ/
任何帮助,将不胜感激!
小智 9
您需要调用以下函数才能使其工作:
var valueUnwrapped = ko.utils.unwrapObservable(valueAccessor())
Run Code Online (Sandbox Code Playgroud)
试试这个小提琴:http://jsfiddle.net/twAcJ/13/
在这种情况下,您的使用with是错误的。如果您使用它,它将按您的预期工作:
<div id="container" data-bind="with: selectedModel">
<div data-bind="custom: $data">
</div>
</div>
Run Code Online (Sandbox Code Playgroud)
这是因为在您的示例中,custom绑定不在 selectedModel 上,而是在整个 viewModel 本身上,而不会更改。
这是它的jsfiddle:http://jsfiddle.net/soniiic/twAcJ/7/