durandal knockout复选框多维数组

时间:2015-03-03 18:12:33

标签: javascript knockout.js durandal

我一直在寻找解决方案,但我找不到任何东西,所以我向你寻求帮助。 knockout从ajax调用获取此数组:

[{"period_id":"2","room_id":"1","room_name":"CDI","room_description":"bla bla","days":[{"day_id":"1","day_name":"Montag"},{"day_id":"2","day_name":"Dienstag"}],"specials":[]}]

我的问题是数组days以及视图中对复选框的绑定:

<td>
                <label class="checkbox-inline">
                    <input type="checkbox" id="monday" value="1" data-bind="checked: days['day_id']"> Montag
                </label>
                <label class="checkbox-inline">
                    <input type="checkbox" id="tuesday" value="2" data-bind="checked: days['day_id']"> Dienstag
                </label>
                <label class="checkbox-inline">
                    <input type="checkbox" id="wednesday" value="3" data-bind="checked: days['day_id']"> Mittwoch
                </label>
                <label class="checkbox-inline">
                    <input type="checkbox" id="thursday" value="4" data-bind="checked: days['day_id']"> Donnerstag
                </label>
                <label class="checkbox-inline">
                    <input type="checkbox" id="friday" value="5" data-bind="checked: days['day_id']"> Freitag
                </label>
            </td>

所以我想,当复选框的值在days时,选中一个复选框。这怎么可能?

感谢您的帮助!

1 个答案:

答案 0 :(得分:0)

数据绑定通常是关于双向通信。如果有人选中复选框,您会发生什么?

如果你只是想要一个视觉表现,你可以使用像这样的东西

<!-- ko if: days[day_id] != null -->
// some green check image
  <img src="check" />
<!-- /ko -->
<!-- ko if: days[day_id] == null -->
// red cross image
   <img src="no check" />
<!-- /ko -->

另外,你应该为你的数据创建一个viewmodel而不是试图直接与你的ajax调用结果进行交互

例如

week: {
   monday: ko.computed(function() {
     return ko.utils.arrayFirst(days , function(day){ return day.day_id == 1;}) != null
     });
   tuesday: ... etc
}