我终于找到了在构建新的MVC4应用程序时开始学习KnockoutJS的时间。我试图找出从已在视图中设置的默认值初始化可观察值的最佳方法。
这是一个人为的例子,但我想直接向视图呈现一个observable的默认值,如下所示:
<input type="hidden"
value="@Model.SomeValue"
data-bind="value: myObservableReference"/>
我知道默认值通常是通过以下方式初始化:
model.myObservableReference = ko.obervable("SomeValue");
但是,我想找到一种扩展初始化的方法:
model.myObservableReference = ko.obervable();
如果存在值,将从绑定中读取现有值。
由于我到目前为止设法保持我的KnockoutJS代码完全不知道剃刀世界,我想避免邋iness:
model.myObservableReference = ko.obervable(@Model.SomeValue);
我猜这可以通过扩展器或自定义活页夹来处理,但如果有人能指出我正确的方向,我们将非常感激。
答案 0 :(得分:21)
您可以尝试创建自己的自定义绑定处理程序来实现此目的:
ko.bindingHandlers.initializeValue = {
init: function(element, valueAccessor) {
valueAccessor()(element.getAttribute('value'));
},
update: function(element, valueAccessor) {
var value = valueAccessor();
element.setAttribute('value', ko.utils.unwrapObservable(value))
}
};
<input type="hidden" value="@Model.SomeValue"
data-bind="initializeValue:myObservableReference, value: myObservableReference"/>
答案 1 :(得分:1)
对于你们googlers,这里是将initializeValue绑定扩展到选择框以及输入框的代码
ko.bindingHandlers.initializeValue = {
init: function(element, valueAccessor) {
if (element.getAttribute('value')) {
valueAccessor()(element.getAttribute('value'));
} else if (element.tagName === 'SELECT') {
valueAccessor()(element.options[element.selectedIndex].value);
}
},
update: function(element, valueAccessor) {
var value = valueAccessor();
element.setAttribute('value', ko.utils.unwrapObservable(value));
}
}
注意:initializeValue绑定应该出现在select的数据绑定属性中的值绑定之前,否则它将无效。
<select data-bind='initializeValue: layout_id, value: layout_id, options: layouts, optionsText: "text", optionsValue: "id"'></select>