typescript - patchValue với { emitEvent: false, onlySelf: true } kích hoạt valueChanges trong Angular

Tôi có một nút Đặt lại mà nút đó đặt lại giá trị của domain bằng patchValue

onReset() {      
    this.addModelForm.patchValue({ domain: '', emitEvent: false, onlySelf: true}); 
}

và đây là phương thức valueChanges cho miền :

this.addModelForm.get('domain').valueChanges.subscribe(domainId => {
    console.log("value changed!")
});

Nó in "value changed!" trên console 2 lần. Tôi không muốn kích hoạt phương thức valueChanges. emitEvent không hoạt động.

Câu trả lời #1

Vì bạn đang sử dụng patchValue trên FormGroup, nó nên như thế này:

Thử cái này:

 this.addModelForm.patchValue( { domain: '' },{emitEvent: false}); 

Câu trả lời #2

Những gì đã hiệu quả với tôi là một cấu trúc giống như thế này, nó cũng hoạt động tốt trong các bài kiểm tra đơn vị.

programmaticUpdate = false; // prevents excessive event emission and infinite loops

// ...

private suppressEvents(callback: () => void) {
  this.programmaticUpdate = true;
  try {
    callback();
  } finally {
    this.programmaticUpdate = false;
  }
}

Cách sử dụng :

this.suppressEvents(() => {
  this.addModelForm.patchValue({ domain: '' }); 
});

Và đừng quên bỏ qua valueChanges theo chương trình như thế này:

this.addModelForm.get('domain').valueChanges.pipe(
  filter(() => !this.programmaticUpdate), // ignore programmatic updates
  takeUntil(this.destroy$), // best practice, read about it online
).subscribe(domainId => {
  console.log("value changed!")
});

emitEvent chưa bao giờ hoạt động với tôi, ngay cả hôm nay với Angular 15.

Nguồn: 6 năm kinh nghiệm với Angular.