Knockout.js 带有KnockoutJS和mvc3.0的嵌套模板

我对击倒JS还不熟悉，但我很享受每天学到的每一点

这是我的问题。根据本教程，假设我的MVC 3.0视图模型中有以下类：

public class MasterModel
{
    public int Id { get; set; }
    public string Description { get; set; }
    public ICollection<ParentModel> Parents { get; set; }
}

public class ParentModel
{
    public int Id { get; set; }
    public string Description { get; set; }
    public ICollection<ChildModel> Children { get; set; }
}

public class ChildModel
{
    public int Id { get; set; }
    public string Description { get; set; }
}

公共类主模型
{
公共int Id{get；set；}
公共字符串说明{get；set；}
公共ICollection父项{get；set；}
}
公共类父模型
{
公共int Id{get；set；}
公共字符串说明{get；set；}
公共ICollection子项{get；set；}
}
公共类儿童模型
{
公共int Id{get；set；}
公共字符串说明{get；set；}
}

HomeController的Index（）方法返回MasterModel的一个实例，其中包含一个ParentModel列表，每个实例依次包含一个ChildModel列表。在客户端，我有以下观点：

@model SomeNamespace.Models.MasterModel

(...)

<script type="text/javascript"> 
    var initialData = @Html.Raw(new System.Web.Script.Serialization.JavaScriptSerializer().Serialize(Model));
    var viewModel = {
        parents: ko.observableArray(initialData.Parents),
    (...)
    };

@model SomeNamespace.Models.MasterModel
(...)
var initialData=@Html.Raw（new System.Web.Script.Serialization.JavaScriptSerializer（）.Serialize（Model））；
var viewModel={
家长：ko.observearray（initialData.parents），
(...)
};

我希望能够使用嵌套模板显示绑定到主模型的ParentModel列表，以及每个ParentModel的ChildrenModel列表。我还希望两个列表（ParentModel和ChildrenModel）都是可观察的数组，以便可以动态添加或删除每个列表的项

我试图在Knockout JS站点上实现这一点，但不确定如何实现包含以下列表的可观察数组。。。可观测阵列

有人能给我指一下正确的方向吗

提前谢谢

这应该能够在路上帮助您，它的工作原理如下：

${name}





${name}





${name}

该代码：

var viewModel = {
    masters: ko.observableArray([
        {
        name: "Master1",
        parents: [{
            name: "Parent 1",
             children : [{
                name: "chlid 1"},
            {
                name: "child 2"}]},
        {
            name: "Parent 2",
             children : [{
                name: "chlid 1"},
            {
                name: "child 2"}]}]},
    {
        name: "Master2",
         parents: [{
            name: "Parent 3",
             children : [{
                name: "chlid 1"},
            {
                name: "child 2"}]},
        {
            name: "Parent 4",
             children : [{
                name: "chlid 1"},
            {
                name: "child 2"}]}]}     ])
};

// ko magic...
ko.applyBindings(viewModel);

---

大家好，这绝对是正确的方法，但从我的示例来看，我如何将initialData变量转换为您建议的主变量、父变量和子变量？我想我的问题可能更多地与javascript有关，而不是与击倒有关…：-）您的初始数据看起来几乎相同。我在假设

@IEnumerable

的情况下模拟了Json结构，这是我的错误。使用

@model SomeNamespace.Models.MasterModel

您的json将不是一个数组，而是一个包含3个属性（Id、Description和一个称为Parents的数组）的主对象。还要注意的是，在我给出的示例中，它只是在那里观察到的主数组，因此UI将对该数组的更改（主对象的push/pop等）作出反应。看看这个：太棒了，映射插件正是我所需要的。非常感谢！