淘汰赛的foreach数字阵列

Question

我有此数组：

[{"room_id":"1","room_name":"CDI","workers":[[{"worker_id":"12","worker_name":"FF","worker_grade":"Q2"},{"worker_id":"13","worker_name":"Test","worker_grade":"Q1"}],[{"worker_id":"12","worker_name":"FF","worker_grade":"Q2"},{"worker_id":"13","worker_name":"Test","worker_grade":"Q1"}],[],[],[{"worker_id":"13","worker_name":"Test","worker_grade":"Q1"}]]},{"room_id":"2","room_name":"DD","workers":[[],[],[],[{"worker_id":"12","worker_name":"FF","worker_grade":"Q2"},{"worker_id":"13","worker_name":"Test","worker_grade":"Q1"}],[]]}] 

我的问题是y中视图模型一个循环：

<tbody data-bind="foreach: rooms"> 
      <tr> 
       <th data-bind="text: room_name"></th> 
       <!--ko foreach: workers--> 
       <td> 
       <!--ko foreach: 0--> 
       <!--ko text: worker_name--><!--/ko--> 
        <!--/ko--> 
       </td> 
       <td> 
        <!--ko foreach: 1--> 
        <!--ko text: worker_name--><!--/ko--> 
        <!--/ko--> 
       </td> 
       <td> 
        <!--ko foreach: 2--> 
        <!--ko text: worker_name--><!--/ko--> 
        <!--/ko--> 
       </td> 
       <td> 
        <!--ko foreach: 3--> 
        <!--ko text: worker_name--><!--/ko--> 
        <!--/ko--> 
       </td> 
       <td> 
        <!--ko foreach: 4--> 
        <!--ko text: worker_name--><!--/ko--> 
        <!--/ko--> 
       </td> 
       <!--/ko--> 
      </tr> 
     </tbody> 

由于工人后数组是没有关联的，我不能循环通过它。但我怎么现在可以通过它，并显示其他阵列，如：

[{"worker_id":"12","worker_name":"Adriaan Wind","worker_grade":"Q2"},{"worker_id":"13","worker_name":"Test","worker_grade":"Q1"}] 

上述解决方案不起作用。

Answer 1

我认为您需要为房间绑定添加名称，如“房间”，以及与工作人员相关绑定的“工作人员”。然后你就可以绑定在下列方式

ko.applyBindings(
 
    { "rooms" : [{ "room_id":"1","room_name":"CDI", 
 
     "workers":[{"worker_id":"12",                   "worker_name":"FF", 
 
        "worker_grade":"Q2"}, 
 
        {"worker_id":"13", 
 
        "worker_name":"Test", 
 
        "worker_grade":"Q1"} 
 
       ]} 
 
       ]});

<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.0.0/knockout-min.js"></script> 
 
<div data-bind="foreach: rooms"> 
 
    Room <span data-bind="text:room_name "></span> 
 
    <div data-bind="foreach: workers"> 
 
     Worker: <span data-bind="text: worker_name"></span><hr/> 
 
    </div> 
 
</div>