我对使用淘汰映射插件有疑问。
我从服务器获取一个简单的数组,并使用映射插件将其转换为javascript对象。由于我希望项目上的属性是可观察的,因此我正在为pugin提供创建回调的自定义映射。
var meeting = function (id, titel, description) {
var self = this;
self.Id = id;
self.Titel = ko.observable(titel);
self.Description = ko.observable(description);
self.Test = ko.computed(function () { return self.Description(); });
return self;
}
var mapping = {
create: function (json) {
return new meeting(json.data.Id, json.data.Titel, json.data.Description);
}
}
当我调用ko.mapping.fromJS(myFetchedData)时,我看到(附带调试器)为数组中的每个项调用create-function。一切都绑定到HTML控件罚款。我看到数组中每个项目都出现了一个li项目。
<ul id="meetings" data-bind=" foreach: meetings">
<li class="ui-widget-content ui-corner-all">
<h1 data-bind="text: Titel" class="ui-widget-header"></h1>
<div>
<input type="text" data-bind="text: $data.Description || 'Omschrijving?'"></input>,
</div>
<div>
<input type="text" data-bind="text: $data.Test || 'Omschrijving?'"></input>,
</div>
<a href="#" data-bind="click: $root.updateMeeting" >Update</a>
<a href="#" data-bind="click: $root.removeMeeting" >Remove</a></p>
</li>
</ul>
但是:Description属性似乎不是Observable。更改该值不会导致Test-calculated属性的更新值。
我在这里错过了什么吗?
任何帮助都将不胜感激。
可以在此处找到完整的示例代码: http://jsfiddle.net/dtiemstra/wRg88/
答案 0 :(得分:2)
您需要绑定到<input>
控件的value
属性 - 而不是其text
属性。
所以而不是:
<input type="text" data-bind="text: $data.Description || 'Omschrijving?'"></input>
你应该写:
<input type="text" data-bind="value: $data.Description || 'Omschrijving?'"></input>