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

Angular 2和TypeScript中的复选框数据绑定

1 个答案: