Angular 19中toObservable致ng build报错：TypeError: r.notifier.notify不是函数

问题场景 #

在Angular 19项目中，通过以下代码将Signal转换为Observable，试图让冷Observable具备BehaviorSubject的特性：

import { toObservable } from '@angular/core/rxjs-interop';
...
export class MyService {
  readonly myData= signal<MyData| null>(null);
  // toObservable creates a cold observable. Use startWith to make it function as a BehaviorSubject.
  readonly myData$ = toObservable(this.myData).pipe(startWith(this.myData()));
}

报错信息 #

执行ng build时，预渲染阶段触发以下错误：

X [ERROR] An error occurred while extracting routes
TypeError: r.notifier.notify is not a function
    at ** (file:///C:/Users/**/.angular/prerender-root/**/chunk-**.mjs:34:86300)
    ....

可行解决方案 #

1. 替换为signalAsObservable API #

Angular 19中toObservable在预渲染场景下存在内部逻辑兼容问题，推荐使用@angular/core/rxjs-interop提供的signalAsObservable——该API专门优化了Signal转Observable的场景，默认会同步发出当前Signal的最新值，无需额外调用startWith，效果等同于BehaviorSubject：

import { signalAsObservable } from '@angular/core/rxjs-interop';
...
export class MyService {
  readonly myData= signal<MyData| null>(null);
  readonly myData$ = signalAsObservable(this.myData);
}

2. 惰性初始化Observable #

如果必须保留toObservable，可通过惰性初始化的方式，避免在预渲染阶段触发内部逻辑，确保Observable仅在首次被订阅时才创建：

import { toObservable } from '@angular/core/rxjs-interop';
...
export class MyService {
  readonly myData= signal<MyData| null>(null);
  private _myData$?: Observable<MyData | null>;
  
  get myData$(): Observable<MyData | null> {
    if (!this._myData$) {
      this._myData$ = toObservable(this.myData).pipe(startWith(this.myData()));
    }
    return this._myData$;
  }
}

3. 排查预渲染路由依赖 #

若上述方法无效，可先暂时禁用预渲染（修改angular.json中projects.xxx.architect.build.configurations.production.prerender为false），确认报错是否消失。若消失，再逐步排查预渲染路由中直接或间接依赖该Service Observable的组件，调整组件的初始化逻辑。

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