如何正确重写继承自使用Observable的服务中的方法？重写MessagingService的add方法后消息不显示问题排查

我来帮你拆解一下这个问题，之前我在Angular项目里继承服务的时候也踩过类似的坑。

问题根源 #

你已经确认子类的add方法被调用了，但父类里的Observable观察者数组为空，核心原因是依赖注入的实例不匹配：

• 虽然你写了MsgService继承自MessagingService，但如果你的组件或其他服务仍然在注入MessagingService，Angular可能会创建两个完全独立的服务实例：一个是父类MessagingService的实例（被组件订阅），另一个是子类MsgService的实例（你调用add的地方）。
• 这就导致你调用子类的add后，super.add操作的是子类实例中父类部分的Observable，但组件订阅的是父类单独实例的Observable——两者根本不是同一个对象，自然观察者数组是空的。

可行的解决方案 #

方案1：全局替换父类的注入提供者（最推荐） #

这个方案不需要修改任何组件代码，只需要配置依赖注入，让Angular在请求MessagingService时，自动返回MsgService的实例。

你可以直接在子类的@Injectable装饰器里配置：

@Injectable({
  providedIn: 'root',
  // 告诉Angular：当需要MessagingService时，用MsgService的实例代替
  useClass: MsgService
})
export class MsgService extends MessagingService {
  constructor() {
    super();
  }

  public add(msg: Message) {
    console.log(msg);
    super.add(msg);
  }
}

或者在根模块（比如AppModule）的providers数组里配置：

@NgModule({
  declarations: [...],
  imports: [...],
  providers: [
    { provide: MessagingService, useClass: MsgService }
  ],
  bootstrap: [AppComponent]
})
export class AppModule { }

这样配置后，所有原来注入MessagingService的组件都会自动拿到MsgService的实例，订阅的Observable和你调用add操作的是同一个，观察者数组就会有值了。

方案2：局部使用子类实例 #

如果你只想在特定组件里用自定义的MsgService，可以直接修改组件的注入代码，换成注入MsgService：

// 组件中注入MsgService而非MessagingService
constructor(private msgService: MsgService) { }

ngOnInit() {
  // 订阅子类实例的Observable
  this.msgService.messages$.subscribe(msg => {
    // 处理消息显示逻辑
  });
}

这种方式需要修改所有需要使用自定义服务的组件，适合局部定制的场景。

方案3：重写Observable属性（需要父类支持） #

如果父类的Observable/Subject是protected或public的，你可以在子类里重新定义这些属性，确保订阅和发送消息用的是同一个对象：

@Injectable({ providedIn: 'root' })
export class MsgService extends MessagingService {
  // 重新定义父类的Subject（假设父类用的是Subject）
  protected messagesSubject = new Subject<Message>();
  public messages$ = this.messagesSubject.asObservable();

  constructor() {
    super();
  }

  public add(msg: Message) {
    console.log(msg);
    // 直接操作子类自己的Subject，不用调用super.add
    this.messagesSubject.next(msg);
  }
}

这个方案的前提是父类允许你访问或覆盖这些Observable相关的属性。

验证小技巧 #

你可以在组件里打印this.msgService，确认它是MsgService的实例；也可以在子类的add方法里打印this.messages$.observers.length，看看有没有订阅者，这样能快速定位问题。

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