0

I have HTML view like below where user's roles are checked. I would like to bind table of changed user's roles using actualizeRoles() method. How can I do that? 

<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>

This is user's roles model below where RoleIds[] has a table of Ids roles.

export class UserRole {
    UserId: number;

    Name: string;

    RoleName: string;
    RoleIds: number[];
}
pegla
  • 1,866
  • 4
  • 17
  • 20
Luki
  • 437
  • 2
  • 6
  • 15

1 Answers1

1

Simple solution:

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

You can read more here:

Angular 2 Checkbox Two Way Data Binding

Adam A
  • 157
  • 1
  • 18