formControl和ngModel

Question

I have the following code on angular 
<div *ngFor="let student of students.controls; let i=index" [formGroupName]="i" [class.active]="student.checked"> 
    <!-- The repeated address template --> 
    <h4>Student #{{i + 1}} 
     <input type="checkbox" formControlName="checked" [(ngModel)]="student.checked"> 
    </h4> 
    <div class="form-group"> 
     <label class="center-block">First Name: 
      <input class="form-control" formControlName="firstName"> 
     </label> 
    </div> 
    <div class="form-group"> 
     <label class="center-block">Last name: 
     <input class="form-control" formControlName="lastName"> 
     </label> 
    /div> 
</div> 

here is my css 

`div.active{ 
    background-color:#CCFFCC !important; 

} 
` 

在該行

當複選框被選中，它包含複選框我的數組元素的背景顏色變成綠色，我想，但formControlName「選中」未考慮到的問題是帳戶，當我刪除[（ngModel）] =「student.checked」我沒有背景顏色改變行爲了，但formControlName「checked」工程

實際行爲，我建立我的數組與導入的學生屬性檢查爲真，該框不被檢查，但當我檢查它時，背景變成g reen

通緝行爲：我建立我的數組與導入的學生的屬性檢查真正的，框中檢查，當我取消選中它的綠色背景消失（我ngModel [（ngModel）] =「student.checked」是與formControlName 「選中」）

Answer 1

我已經找到了解決辦法

<div *ngFor="let student of students.controls; let i=index" 
[formGroupName]="i" [class.active]="student.controls.checked.value> 
    <!-- The repeated address template --> 
    <h4>Student #{{i + 1}} 
     <input type="checkbox" formControlName="checked"> 
    </h4> 

此代碼的工作

感謝您的幫助。

Answer 2

試試這個綁定，使用ngClass

<div [ngClass]="{'active':student.checked}">...</div> 

在div標籤把學生，你有strudent，改變它