チェックボックスのデータバインディングAngular 2とTypeScript

Question

私は、ユーザーの役割がチェックされている以下のようなHTMLビューを持っています。私はactualizeRoles()メソッドを使って、変更されたユーザーの役割のテーブルをバインドしたいと思います。どうやってやるの？

<md-accordion class="example-headers-align"> 
     <md-expansion-panel hideToggle="true" *ngFor="let userRole of userRoles"> 
      <md-expansion-panel-header> 
       <md-panel-title> 
        {{userRoles.UserName}} 
       </md-panel-title> 
       <md-panel-description> 
        {{userRoles.RoleName}} 
       </md-panel-description> 
      </md-expansion-panel-header> 
      <div *ngFor="let role of roles"> 
       <div> 
        <input type="checkbox" [checked]="userRoles.RoleIds == role.Id">{{r.Name}} 
       </div> 
      </div> 
      <md-action-row> 
       <button md-button color="primary" (click)="actualizeRoles()>Approve</button> 
      </md-action-row> 
     </md-expansion-panel> 
    </md-accordion> 

これはRoleIds[]はIds役割のテーブルを有している場合、以下のユーザーのロールモデルです。

export class UserRole { 
    UserId: number; 

    Name: string; 

    RoleName: string; 
    RoleIds: number[]; 
} 

Answer 1

シンプルなソリューション：あなたはここを読むことができ

<input type="checkbox" [(ngModel)]="variable"> 

：

Angular 2 Checkbox Two Way Data Binding