Question

我想在Angular 7应用程序中添加一个通用加载器（旋转程序或类似的东西）。当我转到特定的路线（页面）时，首先我从服务器获取数据。在请求期间，加载程序应该是可见的。

第一个简单的解决方案是像这样的服务：

class PendingService {
    active = 0;
    isActive = false;

    start() {
        this.active++;
        this.isActive = true;
    }

    stop() {
        this.active--;

        if (this.active === 0) {
            this.isActive = false;
        }
    }
}

并像这样使用它：

pendingService.start();
data.get().subscribe(null, null, () => pendingService.stop());

具有绑定：

<spinner [hidden]="!pendingService.isActive"></spinner>

第二个正在使用rjxs，并在可观察到的布尔值中使用挂起。

<spinner [hidden]="pendingService.pending | async"></spinner>

对于Angular 7，哪种解决方案更合适，更快？

Answer 1

没有“正确”的方法，但是async管道的主要优点是，在销毁组件时它将自动从Observable退订。您无需将订阅存储到变量中，也无需通过ngOnDestroy()钩子取消订阅。

Angular-数据加载器-异步绑定或正常

1 个答案: