2

我想根据月中的天数创建动态表并对其应用淘汰赛绑定。到目前为止,我已经创建了基本表并生成了tds

这是我的 KO 视图模型:

 var WorkerModel = function (_workerId, _workerFullName, _daysOfTask) {
     this.workerId = _workerId;
     this.workerFullName = _workerFullName;
     this.daysOfTask = _daysOfTask;
 };

 var AppViewModel = {

     daysInMonth: ko.observable(),
     workersArray: ko.observableArray(),

     getWorkers: function () {
       // get workers from server
     }
 }

我创建了 jsfiddle 示例: jsfiddle

问题是,我不知道如何确定 dayOfMonth 是否为 dayOfTask 并将 html 添加到该 .

foreach: daysInMonth - 创建 td

if (daysOfTask[i] == dayOfMonth) 将 html: "W" 放入 td

另外,我如何使用ko.observable()进行迭代?在小提琴中,我将 daysInMonth 作为observableArray()但不知道如何for loop通过淘汰赛创建。像这样的东西:

daysInMonth = ko.observable(15);

< ko for (i=0; i < daysInMont; i++) >

...一些代码

</ko>

基本上我想得到这个表格布局:

在此处输入图像描述

4

1 回答 1

2

你在正确的轨道上。

您可以使用if绑定有条件地显示“W”。您只需要使用该indexOf方法(或者如果您的浏览器不支持它,则使用 jQuery、underscore.js 等中存在的实现)来检查daysInMonth集合中的当前项目是否在daysOfTask数组中。

您可以从daysInMonth具有属性的当前项目和具有上下文绑定属性$data的实际 daysOfTask数组中获取:$parent

<!-- ko foreach: $root.daysInMonth-->
    <td>
        <!-- ko if: $parent.daysOfTask.indexOf($data) != -1 -->
            W
        <!-- /ko -->
    </td>
<!-- /ko -->

演示JSFiddle。

于 2013-04-18T19:42:48.820 回答