在Angular中,可以通过使用双向数据绑定和事件绑定来改变两个字段的数据。以下是一个示例解决方法:
在component.ts文件中,定义两个字段,并创建一个方法来处理数据的变化:
import { Component } from '@angular/core';
@Component({
selector: 'app-example',
templateUrl: './example.component.html',
styleUrls: ['./example.component.css']
})
export class ExampleComponent {
field1: string;
field2: string;
onField1Change(event: any) {
this.field1 = event.target.value;
this.field2 = this.field1; // 将field1的值赋给field2
}
onField2Change(event: any) {
this.field2 = event.target.value;
this.field1 = this.field2; // 将field2的值赋给field1
}
}
在component.html文件中,创建两个输入框,并绑定到对应的字段和事件:
通过使用双向数据绑定[(ngModel)]
,当输入框的值发生变化时,会自动更新字段的值。而当字段的值发生变化时,会自动更新输入框的值。
通过使用事件绑定(ngModelChange)
,可以在输入框的值发生变化时,调用对应的方法来处理数据的变化。
这样,当其中一个输入框的值发生变化时,另一个输入框的值也会跟着变化。