更改复选框使用“ Y”和“ N”而不是false和true

时间:2019-11-29 12:20:58

标签: angular typescript angular-material

我使用的是mat-checkbox角形材料7,我希望在提交到后端时从true false更改为'Y'和'N'。 我像这样,但是没有用。

HTML

    <form #userForm="ngForm" (ngSubmit)="onSubmit(userForm)" class="form-horizontal row-border">
    <input matInput type="text" class="form-control form-input" name="userId"
                                        [ngModel]="selectedRow?.userId" [readonly]="selectedRow?.userId" id="userId"
                                        required>
    <input matInput type="text" class="form-control form-input" name="userName"
                                                [ngModel]="selectedRow?.userName" id="userName" required>
    <mat-checkbox type="text" name="blocked" [ngModel]="selectedRow?.blocked =='true'? 'Y':'N'"
                                                    id="blocked">{{selectedRow?.blocked}}</mat-checkbox>
<button type="submit" mat-flat-button color="primary"                                    ">Submit</button>
</form>

组件

 onSubmit(form: NgForm ){
    let value = this.selectedRow.blocked == true ? 'Y' : 'N';
    let data = form.value;

}

1 个答案:

答案 0 :(得分:3)

<mat-checkbox type="text" name="blocked" [(ngModel)]="selectedRow?.blocked" id="blocked">{{selectedRow?.blocked}}</mat-checkbox>

代替发送对象,请尝试创建一个类并使用它。 并在您的方法中将数据发送到服务器(作为“ selectedRow”)。无论如何,您可以从“ selectedRow”对象而不是表单中获取数据。将来,请尝试使用ReactiveForms

// create this class in a new file, outside of your component
    export class User {
      userId: number;
      userName: string;
      blocked: string;
    }

send() {
 let user = new User();
 user.userId = this.selectedRow.userId;     
 user.userName = this.selectedRow.userName;
 user.blocked = this.selectedRow.blocked == true ? 'Y' : 'N';
 // send user to api
}