在Knockout foreach Databinding中使用服务器端对象类型

本文关键字：服务器端 对象 类型 Knockout foreach Databinding | 更新日期: 2023-09-27 18:27:21

我从ASP.NET web方法获得此JSON响应

｛"d"：[｛"__type"："KnockoutWebFormsTest.Item"，"Id"：1，"Name"："Item1"，"Description"："Item1.Description"｝，｛"__type"："KnockoutWebFormsTest.Item"，"Id"：2，"Name"："Item2"，"Description"："Item2描述"}]}

然后使用KnockoutJS我可以用这个代码绑定数据，

Javascript:

function bindModel(data) {
    var viewModel;
    viewModel = ko.mapping.fromJSON(data);
    ko.applyBindings(viewModel);
  }

HTML：

<tbody data-bind="foreach: d">
    <tr>
        <td data-bind="text: Id"></td>
        <td data-bind="text: Name"></td>
    </tr>
</tbody>

这在foreach循环中使用了d的对象类型，但现在我需要在foreach循环中使用我的服务器对象类型Item，比如

<tbody data-bind="foreach: Item">

我怎样才能做到这一点？

注意：这与我之前在SO 中的问题有关

编辑1:

服务器端代码（C#）

[WebMethod]
public static List<Item> GetItems()
{
    List<Item> itemlist = new List<Item>
    {
        new Item {Id = 1, Name = "Item1", Description = "Item 1 Description"},
        new Item {Id = 2, Name = "Item2", Description = "Item 2 Description"}
    };
    return itemlist;
}
public class Item
{
    public int Id { get; set; }
    public string Name { get; set; }
    public string Description { get; set; }
}

编辑2:

从这个Javascript代码

var jsonObject;
jsonObject = ko.mapping.fromJSON(data);
console.log(data);
console.log(jsonObject);
console.log(jsonObject.d);

我得到

数据

｛"d"：[｛"__type"："KnockoutWebFormsTest.Item"，"Id"：1，"Name"："Item1"，"Description"："Item 1描述"｝，｛"__type"："KnockoutWebFormsTest.Item"，"Id"：2，"Name"："Item2"，"Description"："Item 2 Description"｝]｝

jsonObject

>Object {d: function, __ko_mapping__: Object}
 >__ko_mapping__: Object
 >d: Object[0]
 >__proto__: Object

jsonObject.d

[]

在Knockout foreach Databinding中使用服务器端对象类型

您无法更改我所看到的默认行为。。由于这是一个返回JSON-从.NET 3.5开始的WebMethod，因此在返回的有效负载上添加d属性是一个突破性的更改。

请参见此处：http://encosia.com/a-breaking-change-between-versions-of-aspnet-ajax/

具体而言：

So the wrapping of the "d" parameter prevents direct execution of the string as script. No Object or Array constructor worries.。

你能做的就是把它分配到其他地方，比如：

var jsonObject;
jsonObject = ko.mapping.fromJSON(data);
var viewModel = { Item: jsonObject.d };
ko.applyBindings(viewModel);

这将允许您设置绑定：

<tbody data-bind="foreach: Item">

您应该更改数据并像这样构建它：

Data = [d:[{
Id: "1",
Name: "Saeed",
LastName: "SWD",
Description: "ok",
Items:[{ Id: "1", Description: "ok"},
       { Id: "1", Description: "ok"}]
}]];

然后您可以访问以下项目：

<table data-bind="foreach: d">
    <tbody data-bind="foreach: Items">
相关文章：