我正在尝试使用MVC Controller中的JsonResult进行简单绑定。 json回来但是knockout observable数组中的绑定确实有效。以下是我的代码。
如果我将json结果直接放到observable它可以工作。我不确定我在这里缺少什么。
淘汰赛代码
<script src="~/Scripts/jquery-1.10.2.min.js"></script>
<script src="~/Scripts/knockout-min.js"></script>
<script src="~/Scripts/knockout.mapping.js"></script>
var viewModel;
vmListModel = function () {
var self = this;
self.Products = ko.observableArray([]);
self.GetData = function () {
$.ajax({
url: '@Url.Action("product", "employees")',
cache: false,
type: 'GET',
contentType: 'application/json; charset=utf-8',
data: {},
success: function (rs) {
console.log(rs); //--> the data returns like this { Id: '1001', Name: 'xavier' }
//self.Products({ Id: '1001', Name: 'xavier' }); // if I put this it binds
ko.mapping.fromJS(rs, {}, self.Products);
//self.Products(ko.mapping.fromJS(rs));
}
});
}
};
$(document).ready(function () {
viewModel = new vmListModel();
ko.applyBindings(viewModel, $('#products1')[0]);
viewModel.GetData();
});
HTML
<table id="products1">
<thead>
<tr>
<th>
ID
</th>
<th>
Name
</th>
</tr>
</thead>
<tbody data-bind="foreach:Products">
<tr>
<td data-bind="text:Id">
</td>
<td data-bind="text:Name">
</td>
<td>
</td>
</tr>
</tbody>
控制器代码
public JsonResult Product()
{
string variablename = "{Id:'1001',Name:'xavier'}";
return Json(variablename, JsonRequestBehavior.AllowGet);
}
错误
未捕获的ReferenceError:无法处理绑定“text:function(){return Id}” 消息:Id未定义
答案 0 :(得分:3)
您正在从控制器传递string
类型的数据并尝试使用mapping
插件进行转换,这种插件在各种类型中都是错误的
FIX:构建一个数组并传递它。因此,映射插件会将所有内容转换为可观察的内容,并且您可以保持成功的双向绑定。
控制器:
var data = new[] { new { Id = "1001", Name = "Nancy" }, new { Id = "1002", Name = "bunny" } };
return Json(data, JsonRequestBehavior.AllowGet);
希望有所帮助