启用/禁用表单控件触发valueChanges Angular 2表单

import { Component, OnInit } from '@angular/core';
import { FormControl } from '@angular/forms';

@Component({
  selector: 'app-form-example',
  template: `
    <form>
      <input type="text" [formControl]="nameControl" />
      <button (click)="toggleValueChanges()">Toggle Value Changes</button>
    </form>
  `,
})
export class FormExampleComponent implements OnInit {
  nameControl = new FormControl('');

  ngOnInit() {
    this.nameControl.valueChanges.subscribe((value) => {
      console.log('Value changed:', value);
    });
  }

  toggleValueChanges() {
    if (this.nameControl.valueChanges.observers.length > 0) {
      this.nameControl.valueChanges.unsubscribe();
    } else {
      this.nameControl.valueChanges.subscribe((value) => {
        console.log('Value changed:', value);
      });
    }
  }
}

// 确保订阅正确
this.nameControl.valueChanges.subscribe((value) => {
  console.log('Value changed:', value);
});

// 取消订阅示例
const subscription = this.nameControl.valueChanges.subscribe((value) => {
  console.log('Value changed:', value);
});

// 取消订阅
subscription.unsubscribe();

const subscription = this.nameControl.valueChanges.subscribe((value) => {
  console.log('Value changed:', value);
});

// 取消订阅以禁用valueChanges事件
subscription.unsubscribe();