Question

我有一个执行一些服务调用并获得承诺的组件。解决承诺后，我正在执行detectChanges。但是有时候，当组件视图已被破坏时，这些诺言就会被兑现，例如用户关闭的选项卡（我们应用程序的内部选项卡）。在那种情况下 ViewDestroyedError: Attempt to use a destroyed view: detectChanges。即使我已经分离了tab.component的销毁阶段视图。我的问题是我在这里做错了什么？

我试图将视图与销毁阶段的变更检测分离开来，但是没有运气，在销毁阶段之后仍未解决诺言，并且仍然调用detectChanges。我确实知道ngOnDestroy实际上并没有破坏该类，并且其中的代码将在垃圾回收阶段被破坏。

这是我的tab.component中导致问题的示例代码

const promises:Promise<any>[] = [];
_.each(types, (type:string) => {
  promises.push(this.service.getResultsBy(type))
})
Promise.all(promises)
.then((data) => {
  //some code here
  this.cd.detectChanges();
})

在ngOnDestroy中，我将视图与C.D分离

ngOnDestroy() {
    this.cd.detach();
  }

在这种情况下，promise对我很重要，因为即使组件被破坏，我也需要做一些计算/状态保存。我只想了解如何才能很好地分离视图，以使我在promise中的代码不会引起更改检测尝试。

Answer 1

不需要从ngOnDestroy上的更改检测中分离出来，也不会帮助解决此错误。但是，无法在调用detectChanges之后调用ngOnDestroy。使用可观察对象，您可以在ngOnDestroy中取消订阅可观察对象。无法取消订阅Promise，因此您将需要在组件中保留一个标志。

export class MyComponent {

  private destroyed = false;

  ngOnDestroy() {
    this.destroyed = true;
  }

  triggerChangeDetection() {
    if (!this.destroyed) {
      this.cd.detectChanges();
    }
  }

}

尝试使用已损坏的视图：尽管视图已分离，但仍会发生detectChanges事件

1 个答案: