Angular 18类型化表单重新赋值后outputFromObservable事件失效

你遇到的问题核心是：outputFromObservable初始化时绑定的是初始sessionForm实例的valueChanges流，当你在effect中替换sessionForm为新的FormGroup后，原订阅仍指向旧表单实例，新表单的自然不会触发输出事件。

方案1：复用现有表单实例（推荐） #

不要直接替换sessionForm，而是用patchValue更新现有表单的值。既保留原有valueChanges订阅，又能同步session数据：

@Component({
  // 组件元数据省略
  outputs: {
    formValueChange: outputFromObservable(() => 
      this.sessionForm.valueChanges.pipe(map(v => new ValueChangeEvent(v)))
    )
  }
})
export class SessionComponent {
  @Input() session: Session | undefined;
  sessionForm = this.fs.group({
    // 初始表单结构定义
  });

  constructor(private fs: FormBuilder) {}

  effect(() => {
    if (this.session) {
      // 用patchValue更新现有表单的值，不替换实例
      this.sessionForm.patchValue(this.session);
      
      // 若需动态调整表单结构（如根据session增删控件），先调整控件再执行patchValue
      // 示例：this.sessionForm.addControl('dynamicField', this.fs.control(''));
    }
  }, { allowSignalWrites: true })
}

方案2：用Signal存储表单实例（适用于动态生成表单结构场景） #

如果必须生成新的FormGroup实例（比如session变化会导致表单结构完全改变），可以用Signal存储表单实例，让outputFromObservable自动订阅新实例的valueChanges：

@Component({
  // 组件元数据省略
  outputs: {
    // 每次sessionForm信号更新时，重新订阅新实例的valueChanges
    formValueChange: outputFromObservable(() => 
      this.sessionForm().valueChanges.pipe(map(v => new ValueChangeEvent(v)))
    )
  }
})
export class SessionComponent {
  @Input() session: Session | undefined;
  // 用Signal存储FormGroup实例
  sessionForm = signal(this.fs.group({
    // 初始表单结构定义
  }));

  constructor(private fs: FormBuilder) {}

  effect(() => {
    if (this.session) {
      // 根据session生成新的FormGroup
      const newForm = this.fs.group({
        // 基于session的动态表单结构
        ...this.session
      });
      // 更新Signal，触发output重新订阅
      this.sessionForm.set(newForm);
    }
  }, { allowSignalWrites: true })
}

• 方案1的核心是保持表单实例不变，避免订阅断裂，是最稳定的实现方式。
• 方案2借助Signal的响应式特性，让outputFromObservable的工厂函数在表单实例更新时重新执行，从而订阅新的valueChanges流。

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