我有一个可观察到的“applicationDetail”（private applicationDetail: Observable<ApplicationDetail>;）。我像这样绑定值：
<h2 class="detailViewH2">{{ (applicationDetail | async)?.AttendeeName }}</h2>
<p>{{ (applicationDetail | async)?.AttendeeFunction }} </p>
这对我来说似乎不是正确的模板语法，有没有办法通常说“applicationDetail”将是异步的，并且它的所有道具都应该使用安全导航运算符？
【问题讨论】：
标签： angular typescript observable templating
在 Angular4 中，您可以使用 *ngIf 解决此问题
<ng-container *ngIf="(applicationDetail | async) as foo">
<h2 class="detailViewH2">{{foo.AttendeeName }}</h2>
<p>{{foo.AttendeeFunction }} </p>
</ng-container>
您还可以创建自己的结构指令，当表达式为 false 时不会删除内容，但会提供此功能。
【讨论】：
(expr1) && (expr2) 不起作用。使用两个ng-containers 的作品，虽然很丑陋。
<ng-container *ngIf="{a: applicationDetail | async, b: bar | async } as foo">{{foo.a.AttendeeName}} {{foo.b.bar}}</div>。虽然还没有尝试过自己。这也将阻止*ngIf 删除内容，因为该值始终是真实的。