Angular 2：嵌套複選框

我想使用複選框來選擇父對象，然後只顯示該對象上的屬性（數組）的複選框。例如，我有一個產品的對象，每個產品都有一些項目。我想顯示產品中所有項目的檢查清單，但僅限於產品本身已被檢查。Angular 2：嵌套複選框

我試着通過它下面的代碼顯示或隱藏基於初始值的項目 - 我希望能夠打開和關閉複選框，並隱藏或顯示項目。

<div *ngFor="let product of products; let i = index" #ref> 
    <md-checkbox type="checkbox"> {{product.productTitle}}</md-checkbox> 
    <div *ngIf="ref.checked"> 
     <div *ngFor="let item of product.items; let i = index"> 
      <md-checkbox type="checkbox">{{item.code}}</md-checkbox> - {{item.name}} 
     </div> 
    </div> 
</div>

來源

2017-07-28 ccocker

是你的產品FormArray中定義的？ – joshrathke

目前，我的計劃是採取選定的項目，並將其顯示在表單中。如果有幫助，我可以將產品放入表單中？ – ccocker

你介意發佈組件代碼，還是至少formGroup聲明？ – joshrathke

你的#ref是你的div，你正在檢查它是否被檢查。該div永遠不會返回真正的檢查正確嗎？你需要引用你的並在那裏檢查checked。

例如（根據您的MD-CheckBox組件是如何配置的）：

<div *ngFor="let product of products; let i = index"> 
    <md-checkbox type="checkbox" #ref> {{product.productTitle}}</md-checkbox> 
    <div *ngIf="ref.checked"> 
     <div *ngFor="let item of product.items; let i = index"> 
      <md-checkbox type="checkbox">{{item.code}}</md-checkbox> - {{item.name}} 
     </div> 
    </div> 
</div>

來源

2017-07-28 17:41:21 joshrathke

Angular 2：嵌套複選框

回答

相關問題