解决 ko mapping 数组无法添加新对象的问题
浏览数：27 /
时间：2015年06月11日
这两天页面模板化的进程有些放缓，使用 ko mapping 插件的情形多了起来。
组员经常问到的问题即是往 ko mapping 数组添加新对象时，报找不到方法的错误；
而使用 ko.observableArray 创建的数组则可以随意添加或删除对象，这简直奇葩问题。
好吧，不管怎样，总要解决问题的。
// 数组定义 var ViewModelArray = ko.mapping.fromJS([]);
<!--绑定文本--> <ul data-bind="foreach:$data"> <li data-bind="text:Name().substr(0,5), attr:{‘id‘:Id}"></li> </ul>
以上定义完成之后，即可以执行页面加载和绑定了。
$(function () { ko.applyBindings(ViewModelArray, ul); });
完成了 ul 的创建之后，某个事件触发了添加动作，需要根据数据创建新的 li 对象添加到 ul 中，例如：
function Add(){ var data = { Id: $(‘#txtId‘).val(), Name: $(‘#txtName‘).val() }; ViewModelArray.push(data); // 这里可能出现“找不到方法”的错误。 }
进过一番调试发现，由于需要对 Name 属性进行特殊处理，绑定文本中使用 Name() 读取了 Name 的值，而添加方法中的 data 是普通 JS 对象，并不具备 ko 对象的属性方法，因此出现了找不到方法的错误。
解决方法：
1、在后台处理好 Name 属性，前端绑定文本尽量不使用属性方法。
2、将 Add 方法中的 data 处理为 ko 对象再添加。
function Add(){ var data = { Id: $(‘#txtId‘).val(), Name: $(‘#txtName‘).val() }; ViewModelArray.push(ko.mapping.formJS(data)); }
建议采用第二种方式。
转载请注明来自飞扬的尘埃的博客。
郑重声明：本站内容如果来自互联网及其他传播媒体，其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享，并不代表本站赞同其观点和对其真实性负责，也不构成任何其他建议。
