Question

我是淘汰赛的新手，现在我遇到了问题，我的代码在这里：

视图模型：

var projectModel = {
dateProject: ko.observableArray()
};

ko.applyBindings(projectModel, document.getElementById('projectShow'));

HTML：

<div id="projectShow">
    <!-- ko foreach: dateProject -->
    <span data-bind="text:createDay"></span>
    <ul>
        <!-- ko foreach: projectList -->
        <li>
        </li>
        <!-- /ko -->
    </ul>
    <!-- /ko -->
</div>

<a id="add" href="javascript:void(0)" target="_self">an button</a>

点击事件

$('#add').click(function(){
    projectModel.dateProject().length = 0;
    var projectItems = [
        {
            createDay:'2014/03/16',
            projectList:[
                {   
                    checkResult: "good",
                    labelArr: ['hello','world']
                },{ 
                    checkResult: "general",
                    labelArr: ['hi','world']
                }
            ]
        },{
            createDay:'2014/03/17',
            projectList:[
                {   
                    checkResult: "good",
                    labelArr: ['hello','world']
                },{ 
                    checkResult: "general",
                    labelArr: ['hi','world']
                }
            ]
        }
    ]

    foreach(var i = 0;i<projectItems.length;i++){
        projectModel.dateProject().push(projectItems[i])
    }
});

当点击事件被触发时，我清除模型的根数组（observableArray），并向其推送一些新项目，但ui不会自动更新，任何人都可以告诉我什么＆＃39 ;代码问题？也许knockout-mapping-plugin可以解决这个问题，但我不知道如何。

任何帮助将不胜感激。

Answer 1

你有一些小错误，你喜欢forloop的语法错误，并清除根数组使用removeAll函数。它应该是： -

projectModel.dateProject.removeAll();//clear root array
for(var i = 0;i<projectItems.length;i++){
    projectModel.dateProject.push(projectItems[i]) //don't use  '()'  with projectModel.dateProject
}

在视图中为嵌套的observable数组添加数据绑定。

<div id="projectShow">
  <!-- ko foreach: dateProject -->
   <span data-bind="text:createDay"></span>
   <ul>
     <!-- ko foreach: projectList -->
       <li data-bind="text:checkResult"></li>
       <li data-bind="text:labelArr"></li>
     <!-- /ko -->
  </ul>
 <!-- /ko -->
</div>

Fiddle Demo

如何将KnockoutJS与Observable嵌套数组一起使用？

1 个答案: