首页 > 解决方案 > 使用 Observable 闪烁 *ngIf 的内容

问题描述

我开发了一个 Angular 应用程序。我想在我的应用不在生产中时显示一些文本,否则什么也没有。我有以下代码,其中环境是可观察的:

<span *ngIf="(environment | async) !== 'production'">bla bla text...

问题在于,只要未解决可观察对象,它就会显示内容。

我认为这可以解决:

undefined !== 'somestring'

因此条件得到验证并显示文本。这不是我想要的,我不想要显示,在可观察的分辨率之前不评估表达式。

我应该使用什么语法来防止不受欢迎的内容闪现?

谢谢你的帮助

标签: angularrxjsobservableangular-ng-if

解决方案


在您的组件中一劳永逸地订阅,并在您的模板中测试实际发出的值:

<span *ngIf="env && env !== 'production'">

或者在您的模板中订阅一次,并将结果存储在一个变量中:

<ng-container *ngIf="environment | async as env">
  <span *ngIf="env !== 'production'">

推荐阅读