angularjs - Angular 两个 ng-repeat 在一张表中重复

Question

我正在做一个新项目，我真的被困在那张桌子上了。

有两个对象列表：settingtime和settings，我想用 ng-if 将它们放在一个单元格中。但是当我这样做时，它们是重复的，只会产生更多的细胞。

*一件事是每天有 7 张桌子。这是星期天的一个例子。

我要检查的 Ng-if 是当settingTime.id等于setting.settingTimeid 并且当它们相等时将它们放在一个单元格中。

HTML：

<table class="table table-bordered table-striped">
<tr>
    <th>Sunday</th>
</tr>
<tbody ng-repeat="setting in settings">
<tr ng-repeat="settingtime in settingtimes | orderBy:'time' | filter:by_shiftDay" ng-if="settingtime.shiftDay=='SUNDAY'">
    <td ng-if="setting.settingTimeId==settingtime.id">
    {{settingtime.shiftDay}}
    </br>
    {{settingtime.time}}
    </br>
    SettingTimeId: {{setting.settingTimeId}} {{settingtime.id}}
    </br>
    Role:{{setting.role}}
    </br>
    WorkerAmount:{{setting.workerAmount}}
    <button class="btn btn-primary" ui-sref="editsettingtime" ng-click="EditSettingTime(settingtime.id)">Edit</button>
    </br><button class="btn btn-primary" ng-click="getAllRoles(); toggleRight(); saveSettingTime(settingtime.id); showAddSetting()">AddSetting</button>
     </td>
</tr>
</tbody>

---

settingtime: [
    {"id":2,"shiftDay":"MONDAY","hours":0,"minutes":0,"time":"12:00"},
    {"id":202,"shiftDay":"SATURDAY","hours":0,"minutes":0,"time":"06:00"},
    {"id":5,"shiftDay":"FRIDAY","hours":0,"minutes":0,"time":"17:30"},
    {"id":4,"shiftDay":"SUNDAY","hours":0,"minutes":0,"time":"19:00"}, 
    {"id":302,"shiftDay":"WEDNESDAY","hours":0,"minutes":0,"time":"15:00"}, 
    {"id":3,"shiftDay":"MONDAY","hours":0,"minutes":0,"time":"06:00"}, 
    {"id":1,"shiftDay":"SUNDAY","hours":0,"minutes":0,"time":"15:00"}, 
    {"id":101,"shiftDay":"TUESDAY","hours":0,"minutes":0,"time":"10:00"}, 
    {"id":201,"shiftDay":"THURSDAY","hours":0,"minutes":0,"time":"12:00"}, 
    {"id":6,"shiftDay":"WEDNESDAY","hours":0,"minutes":0,"time":"10:00"}
]

settings: [
    {"id":2,"settingTimeId":4,"role":1,"workerAmount":1},
    {"id":4,"settingTimeId":1,"role":4,"workerAmount":3},
    {"id":1,"settingTimeId":1,"role":1,"workerAmount":1},
    {"id":3,"settingTimeId":1,"role":2,"workerAmount":2}]

标签： angularjs