将组件留给另一个组件时取消后台进程？

Question

我正在使用这个图片:

https://github.com/VadimDez/ng2-pdf-viewer

我创建了一个存储库,其中包含我的问题示例.

https://github.com/YeisonVelez11/pdf

我正在生成一个pdf,这很好用.但如果pdf还没有完成加载,我导航到另一个组件,我收到一个错误.

基本上当我回到预览时,我遇到了问题,因为正在加载的pdf无法取消.我不知道我可以做什么技巧随时退出文档视图.

  <pdf-viewer [src]="archivo_adjunto"
              *ngIf="archivo_adjunto"
              [render-text]="false"
              [original-size]="true"
              [page]="1"
              [autoresize]="true"
              [show-all]="true"
              style="display: block;"
              (page-rendered)="pageRendered($event)"
  ></pdf-viewer>

ionViewDidLoad() {
this.archivo_adjunto="./assets/documents/Resumen Ejecutivo Autoevaluacion.pdf"

}

这是在Ionic中完成的,但功能在Angular中.

Answer 1

在大型应用程序或处理大量可观察量或主题或行为主题的组件中，最好在离开组件时取消订阅可观察量，以防止内存泄漏或减慢系统速度等问题。

 ngOnDestroy(){
   this.ObservableOrSubsject1$.unsubscribe();
   this.ObservableOrSubsject2$.unsubscribe();
   ....
 }

另外不要忘记在类中实现 OnDestroy。

导出 MyComponent 实现 OnInit、OnDestroy

还有另一种我真正喜欢的好方法，您可以在处理订阅时使用它；您可以在其中提供一个主题，例如：

私有onDestroy$：主题=新主题（）；

当将任何可观察的（例如：映射或订阅）管道与 takeUntil 一起使用时：

ngOnInit(){
   this.ObservableOrSubsject1
     .pipe(takeUntil(this.onDestroy$))
     .subscribe((result: IResult) => {
       this.result= Object.assign({}, result);
   });

在 ngOnDestroy 中只需传递“this.onDestroy$.next()”：

ngOnDestroy(){
   this.onDestroy$.next();
 }

再次强调，不要忘记在类中实现 OnDestroy。

最后，我建议使用 Ngrx/Store 和 Ngrx/Effects来管理您的状态并统一应用程序中的事件；这将为您免除许多麻烦，并使您的应用程序保持在标准架构中。