Angular 2 Observable 用于提供 CSS 类的测试值答案

【问题标题】：Test value of Angular 2 Observable for giving CSS classAngular 2 Observable 用于提供 CSS 类的测试值
【发布时间】：2016-02-21 21:56:37
【问题描述】：

我可以在 html 中使用 {status_async | async} 显示 Observable 生成的值。

但是，我如何测试这个 Observable 是否等于某物？

具体来说，我想用它来分配一个类：

<div [ngClass]="{'has-danger': status_async == 'created before'}">
    <input type="text">
</div>

我发现我可以使用：

<div [ngClass]="{'has-danger': (status_async | async) == 'created before'}">

但是问题就变成了我已经使用了两次异步（这里和显示值）。

当我检查成功创建的状态时，具有讽刺意味的是，在第二次异步之后，值更改为“之前创建”，即使我只单击了一次创建按钮。

我该如何解决这个问题？

【问题讨论】：

【解决方案1】：

在同一个 observable 上使用多个异步管道时需要小心，因为这意味着它现在有多个订阅者（订阅方法被多次调用，每次使用异步管道一个）。

对于通过 HTTP 调用创建的 observable，如果订阅两次，相应的请求将被调用两次）...默认情况下，这样的 observable 是冷的（它们不能共享）。

你需要使用 share 方法让你的 observable 变热：

this.status_async = this.status_async.share();

【讨论】：

我是 return，来自 http.post.map()，然后在视图中 { status_async | async}。我注意到this.status_async = this.status_async.share(); 之后不再工作了。
您将map方法的返回设置到status_async属性中？你有没有像地图一样添加共享操作符？
只需执行以下操作：http.post(...).map(...).share()。这应该有效。
看到这个答案：stackoverflow.com/questions/34677947/…
导入共享操作符：import 'rxjs/add/operator/share';