为什么 [class.someClass] 和 [ngClass] 绑定与 myObservable$ 的工作方式不同 |异步？答案

【问题标题】：Why do [class.someClass] and [ngClass] bindings work differently with myObservable$ | async?为什么 [class.someClass] 和 [ngClass] 绑定与 myObservable$ 的工作方式不同 |异步？
【发布时间】：2016-06-16 14:18:47
【问题描述】：

我有一个想要应用某个类的元素，所以我使用了一个 [class.active] 条件来观察 Observable 的变化。但是当我切换它不适用于以下li 并分解整个应用程序：

<li *ngFor="let room of activeRooms$ | async" [class.active]="room.name === (currentRoomName$ | async)">

我发现如果我用 [ngClass] 代替，它可以完美地工作：

<li *ngFor="let room of activeRooms$ | async" [ngClass]="{ active: room.name === (currentRoomName$ | async)}">

这是为什么呢？任何人都可以对此有所了解吗？

谢谢！

【问题讨论】：

标签： angular rxjs

【解决方案1】：

无法确定，但只是提出几个想法，您可以检查什么：

将 Observable 更改为 EventEmitter，它们的执行方式略有不同；您可以阅读here 了解更多信息。
可观察事件可以在 angular NgZone 之外的某个地方生成；在这种情况下，您需要将其注入您的组件并通过以下方式更新您的属性：

zone.run(() => this.prop = newValue);

这样 Angular 会看到您的更改，否则它无法看到。您可以在此处阅读有关区域的更多信息：another link

【讨论】：