Angular订阅回调生效但Complete回调未执行问题求助

兄弟，你的问题出在subscribe的参数写法错误上！仔细看你的代码，你把error和complete回调写进了next回调的函数体里，用逗号分隔，这导致subscribe根本没接收到这两个回调，自然complete不会触发。

先看你原代码的问题点：

this.bs.getAddons().subscribe((data: any) => {
  //Done Loading packages -> load addons 
  this.bs.addons = data, 
  error => console.log(error), 
  () => sidenav.open(); 
});

这里的error => console.log(error)和() => sidenav.open()并不是subscribe的第二、第三个参数，而是next回调函数内部的逗号表达式——相当于你只给subscribe传了一个next回调，后面两个函数完全没被识别成error和complete回调。

给你两种修正方案，任选其一：

方案1：分开传递三个独立回调 #

把next、error、complete作为subscribe的三个独立参数传递，每个参数是单独的函数：

this.bs.getAddons().subscribe(
  // next回调：接收数据
  (data: any) => {
    this.bs.addons = data;
  },
  // error回调：处理错误
  (error) => {
    console.log(error);
  },
  // complete回调：流完成时触发
  () => {
    sidenav.open();
  }
);

方案2：使用对象字面量（更推荐，可读性拉满） #

用next/error/complete作为键的对象来传递回调，这种方式不会搞混参数顺序，代码更清晰：

this.bs.getAddons().subscribe({
  next: (data: any) => {
    this.bs.addons = data;
  },
  error: (error) => {
    console.log(error);
  },
  complete: () => {
    sidenav.open();
  }
});

另外补充一点：要确保getAddons()返回的Observable是会主动完成的（比如HttpClient发起的HTTP请求，请求结束后Observable就会complete）。如果是那种持续发射数据的流（比如WebSocket、interval定时器），complete回调永远不会触发，但你说数据已经成功加载，所以应该是前者，修正写法后就能正常触发complete了。

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