Angular 11 如何使用observable替代complete回调解决subscribe弃用警告

问题原因 #

这个弃用警告是RxJS v6+ 对subscribe方法的重载规则调整导致的：过去支持直接传入next、error、complete三个独立回调的写法被标记为弃用，要求传入统一的*观察者对象（Observer）*作为唯一入参。

适配Angular 11的正确写法 #

仅需要监听表单值变化的场景（匹配你现有代码逻辑）

this.signupForm.valueChanges.subscribe({
  next: (value) => console.log(value)
})

完整观察者写法（包含错误处理、完成回调）

如果需要补充错误捕获和监听终止的回调逻辑，可以补全观察者对象的对应属性：

this.signupForm.valueChanges.subscribe({
  next: (value) => console.log('表单值更新：', value),
  error: (err) => console.error('监听异常：', err),
  complete: () => console.log('表单监听已终止')
})

附加注意项 #

Angular中使用valueChanges持续监听表单值时，建议在组件销毁时主动取消订阅，避免内存泄漏，推荐用takeUntil操作符实现：

import { Subject } from 'rxjs';
import { takeUntil } from 'rxjs/operators';

// 组件类内定义销毁触发器
private destroy$ = new Subject<void>();

ngOnInit() {
  this.signupForm.valueChanges
    .pipe(takeUntil(this.destroy$))
    .subscribe({
      next: (value) => console.log(value)
    })
}

ngOnDestroy() {
  this.destroy$.next();
  this.destroy$.complete();
}

内容的提问来源于stack exchange，提问作者Andrea Di Giovanni