将两个异步订阅放在一个Angular * ngIf语句中 [英] Putting two async subscriptions in one Angular *ngIf statement

问题描述

我的组件模板中包含以下内容:

I have the following in my component template:

<div *ngIf="user$ | async as user>...</div>

在上面的div中，我想使用异步管道仅订阅一次另一个可观察到的对象，就像在整个模板中使用上面的user一样.因此，例如，这样的事情是可能的:

Within the above div I would like to use the async pipe to subscribe to another observable only once, and use it just like user above throughout the template. So for instance, would something like this be possible:

<ng-template *ngIf="language$ | async as language>
<div *ngIf=" user$ | async as user>
  <p>All template code that would use both {{user}} and {{language}} would go in between</p>
  </div>
</ng-template>

或者甚至可以将其合并为一条语句吗?

Or can this even be combined in one statement?

推荐答案

您可以将对象用作变量:

You can use object as variable:

<div *ngIf="{ language: language$ | async, user: user$ | async } as userLanguage">
    <b>{{userLanguage.language}}</b> and <b>{{userLanguage.user}}</b>
</div>

柱塞示例

Plunker Example

另请参见

• 如何声明变量在Angular2的模板中

这篇关于将两个异步订阅放在一个Angular * ngIf语句中的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！