Angular 5 ngIfElse：将条件结果存储在变量中

Question

代码：

<mat-icon [ngClass]='{ rotate: !users }'>refresh</mat-icon>
<div *ngIf="usersObservable | async as users; else loading">
  ...
</div>
<ng-template #loading let-users>
  Waiting...
</ng-template>

预期： rotate class 在用户加载时应用于 <mat-icon>

结果： class 未应用

问题：是否可以store/use ngIfElse 评估的布尔结果？

P.S.: 在此示例中，我希望 rotate class 应用于 <mat-icon> 直到 HTTP 请求完成。

Answer 1

as users 变量仅在应用 *ngIf 的标签上或标签内的绑定范围内。

你会做类似的事情

<mat-icon [ngClass]='{ rotate: !(usersObservable | async)?.users }'>refresh</mat-icon>

确保您的 Observable 在多次订阅时表现正常。例如

中提到的一些方法

Angular 5 ngIfElse：将条件结果存储在变量中

Angular 5 ngIfElse: Storing conditional result in a variable

angular-ng-if

angular