0

我已经和 Angular 一起工作了几个星期,我发现了一个问题,我完全不确定如何去做。

我在一个页面上有一个大约 100 个按钮类型输入的列表,每个输入在我的数据库中都表示不同的值。正如您在此片段中看到的那样,我将其中的每一个都链接到了一个模型:

单击时应更改的输入

它们的行为与单击其中一个输入时的行为相同,该模型的值应该改变。我面临的问题是我只能考虑为每个输入创建一个函数,我认为这不是最好的方法。

对于这些情况,我想知道当您有多个具有相同模式的属性但它们都对应于 db 上的不同值时,我如何创建一个通用函数来在 Angular 上更新它们

<div class="col-sm-8"> <div class="btn-group"> <input type="button" name="C0R" (click)="changeSpineBoxValue($event)" [(ngModel)]="examData.ExamCervical.C0R" > <input type="button" name="C0C" [(ngModel)]="examData.ExamCervical.C0C"> <input type="button" name="C0L" [(ngModel)]="examData.ExamCervical.C0L"> </div> </div>

所以,正如我所说,有 100 个这样的输入

<input type="button" name="C0L" [(ngModel)]="examData.ExamCervical.C0L">

我想创建一个打字稿函数,在单击任何这些输入时触发。单击输入时,ngmodel 值应更改。我知道我可以做类似的东西

changeC0LValue(value: number){
 this.examData.ExamCervial.C0L = value;

}

但是因为我有 100 个输入,所以我需要像上面那样做 100 个函数(每个值一个)。我想知道是否有一种通用方法可以做到这一点(我不知道您是否可以在一个函数中发送属性名称和值,并且该函数可以根据名称将值设置为 ngmodel) , 例如 :

changeInputModelValue( inputname: string, value: number){
     //check for inputname and create the binding
    // set the passed value to the ngmodel based on the name
}
4

1 回答 1

0

你可以这样做:

<input type="button" name="C0R" (click)="changeInputModelValue('COR', $event)"/>
changeInputModelValue( inputname: string, value: number){
     this.examData.ExamCervial[inputName] = value;
}

只是一种方法。

方法#2

<input type="button" name="C0R" (click)="changeInputModelValue($event)"/>
changeInputModelValue(event: MouseEvent){
     const name = event.target.attributes.name.value;
     const value = event.target.attributes.value.value;
     this.examData.ExamCervial[name] = value;
}
于 2019-10-14T16:40:49.377 回答