尽管 *ngIf 评估为 false，但异步管道仍在执行

Question

我在使用异步管道时遇到问题，因为我想要一个能够同时依赖异步和静态数据的列表。但是，我无法理解如何巧妙地做到这一点。

现在看起来是这样的：

<ul>
  <li *ngIf="true" *ngFor="let item of list">{{item}}</li>
  <li *ngIf="false" *ngFor="let item of list | async">{{item}}</li>
</ul>

这是非常烦人的部分，即使*ngIf 是假的，异步管道仍然会尝试做它的事情。导致应用程序崩溃并抛出错误，指出异步管道的参数类型错误，因为它需要一个承诺而不是数组。

所以我的问题是，它为什么要这样做，什么是实现我想要的更好、更正确的方法？

Answer 1

更改模型，以便即使您的数据是静态的，模板也可以成为可观察的。这可以通过Observable.of()轻松完成

例如，假设您通常从 getData() 函数获取 observable，但是当数据是静态的时，您从 getStaticData() 函数获取它。你会这样做：

型号

if(isDataStatic){
    //convert static data into an observable that emits that data
    this.list = Observable.of(this.getStaticData());
}else{
    //however you typically get the observable
    this.list = this.getData();
}

因此，list 将始终是可观察的，即使您的数据是静态的。模板可以保持简单。

模板

<ul>
  <li *ngFor="let item of list | async">{{item}}</li>
</ul>