在Angular 7中,可以通过使用setValue方法而不是patchValue方法来设置选定值而不触发更改事件。以下是一个示例代码:
首先,在你的组件类中,定义一个表单控件和一个用于处理表单更改事件的方法。
import { Component, OnInit } from '@angular/core';
import { FormBuilder, FormGroup } from '@angular/forms';
@Component({
selector: 'app-example',
templateUrl: './example.component.html',
styleUrls: ['./example.component.css']
})
export class ExampleComponent implements OnInit {
myForm: FormGroup;
constructor(private fb: FormBuilder) { }
ngOnInit() {
this.myForm = this.fb.group({
myControl: [''] // 初始化表单控件
});
this.myForm.get('myControl').valueChanges.subscribe(value => {
console.log('表单值已更改:', value);
});
}
setSelectValueWithoutChangeEvent() {
this.myForm.get('myControl').setValue('选定的值', { emitEvent: false });
}
}
在上述代码中,我们使用FormGroup和FormBuilder来创建一个带有一个名为myControl的表单控件的表单组。
在ngOnInit方法中,我们订阅了myControl表单控件的valueChanges事件,以便在表单值更改时触发相应的方法。
在setSelectValueWithoutChangeEvent方法中,我们使用setValue方法来设置myControl的选定值,并传递一个选项对象{ emitEvent: false }来禁止触发更改事件。
最后,你可以在你的模板中使用setSelectValueWithoutChangeEvent方法来设置选定值,而不触发更改事件。
这是一个简单的例子,展示了如何在Angular 7中设置选定值而不触发更改事件。你可以根据自己的需求进行适当修改和扩展。