角4使用嵌套* ngFor正確

我正在實施更新webservice。爲此，我從數據庫中提取數據並使用它填充表單域。然後用戶需要編輯數據並提交它以更新數據庫。角4使用嵌套* ngFor正確

我需要幫助實現這與複選框。我正在嘗試使用嵌套的* ngFor來獲取2個不同的Web服務。「maintenanceanceTypeList」包含所有複選框選項，「defaultmaintainance」包含用戶提交創建表單時選中的選項。正如你所看到的，我試圖比較兩者的id，並在比較返回true時檢查複選框。

我的問題是，嵌套循環的迭代現在取決於我的defaultmaintainance有多少對象，這意味着多次顯示相同的複選框。

<label for="maintenancetype" 
     class="text-3ab08b text-transform" 
     style="margin-right: 1em;"> 
    Maintenance Type: 
</label> 
<span *ngFor="let x of maintainanceTypeList"> 
    <span *ngFor="let y of defaultmaintainance"> 
     <md-checkbox *ngIf="x.isDeleted == 0" 
        name="{{x.maintenancetype}}" 
        [checked]="x._id == y._id" 
        (change)="changeMaintainance($event.checked, x)" 
        value="{{x.maintenancetype}}"> 
      {{x.maintenancetype}} 
     </md-checkbox> 
    </span> 
</span>

編輯：兩個陣列與本格式的多個對象的對象的數組：

isDeleted:"0" 
maintenancetype:"Fixed" 
status:"1" 
_id:"5971da2c958ccd42a9c99f54"

來源

2017-07-26 Ninad Gaikwad

不需要我需要訪問兩個完全不同的數組。 –

縮回。你也可以請發佈'maintainanceTypeList'和'defaultmaintainance'的樣子嗎？ – msanford

我已經更新了問題 –

我將修改maintainanceTypeList添加到每個它的項目的附加屬性，它顯示了應此文件是檢查或不：

let selectedIds = defaultmaintainance.map(item => item._id); 

maintainanceTypeList.forEach(checkbox => { 
    checkbox.checked = (selectedIds.indexOf(checkbox._id) > -1) ? true : false; 
})

，然後顯示在一個單一的maintainanceTypeList * ngFor循環：

<span *ngFor="let x of maintainanceTypeList"> 
    <md-checkbox *ngIf="x.isDeleted == 0" 
       name="{{x.maintenancetype}}" 
       [checked]="x.checked" 
       (change)="changeMaintainance($event.checked, x)" 
       value="{{x.maintenancetype}}"> 
     {{x.maintenancetype}} 
    </md-checkbox> 
</span>

來源

2017-07-26 14:02:56 hiper2d

角4使用嵌套* ngFor正確

回答

相關問題