负载指示器未显示在角形标题中

Question

在服务呼叫期间，我已经给出了加载指示器，但是这并不能阻止用户点击标题项目。我想阻止用户在页面上执行任何操作，直到加载指示器停止。

Answer 1

在标题上添加一个类。

.disabled {
    cursor: not-allowed;
}

<div [hidden]="loading" class="loading-indicator">
    <loading-indicator></loading-indicator>
</div>

 <app-header [ngClass]="{'disabled' : !loading}"></app-header>

Answer 2

尝试使用*ngIf ...else

<app-header *ngIf="!loading;else loading_content">
    content here ...
</app-header>

<ng-template #loading_content>Loading content...</ng-template>