Angular响应式表单：订阅statusChanges如何捕获最后发射值？

你用last()没输出的原因是：last()操作符需要等待Observable完成后才会发射最后一个值，但Angular表单的statusChanges是一个持续发射的流——只要表单状态变化就会一直触发，永远不会自动完成，所以last()永远不会执行回调。

针对你的场景（按键时先触发invalid再触发valid，只需要最终的valid状态），可以用以下两种方案：

方案1：使用debounceTime过滤中间状态 #

两次状态变化（invalid→valid）是在极短时间内连续发生的，通过添加一个小延迟（比如30ms），可以自动忽略中间的过渡状态，只拿到最终稳定的状态：

config.test = config.cellEditingFormGroup.statusChanges
  .pipe(debounceTime(30))
  .subscribe((value) => {
    console.log(value); // 只会输出valid
  });

方案2：过滤并捕获有效状态（适合明确状态流转的场景） #

如果你确定每次按键只会产生invalid→valid的固定流转，可以结合filter直接捕获valid状态，若需要持续监听后续输入则去掉take(1)：

config.test = config.cellEditingFormGroup.statusChanges
  .pipe(
    filter(status => status === 'VALID'),
    take(1) // 仅捕获单次按键后的valid，持续监听则移除该行
  )
  .subscribe((value) => {
    console.log(value);
  });

注意：避免内存泄漏 #

不管用哪种方案，都要记得在组件销毁时取消订阅，防止内存泄漏。可以用takeUntil操作符实现：

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

// 组件内定义销毁信号
private destroy$ = new Subject<void>();

ngOnInit(): void {
  config.test = config.cellEditingFormGroup.statusChanges
    .pipe(
      debounceTime(30),
      takeUntil(this.destroy$)
    )
    .subscribe((value) => {
      console.log(value);
    });
}

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

内容的提问来源于stack exchange，提问作者derstauner