Angular 视图就绪时使用异步管道获取数据

我有一个基本的表组件。用户可以重新加载和过滤数据。 对于这两个动作，我使用主题

private fetchFromServer$ = new Subject<void>();
private filter$ = new Subject<void>();

之后，可观察对象（带有外部数据）将与过滤对象组合，如下所示：

data$ = combineLatest([this.externalData$, this.filter$]).pipe(
  switchMap(([externalData]) => this.search(externalData))
);

以下是基本视图：

<div *ngIf="data$ | async as data">
  {{data |json}}
</div>

<button (click)="reload()">reload</button>
<button (click)="filter()">filter</button>

在正确的位置上

但这正是我的问题。那两条线在哪里？ 如果我将它们放在ngOnInit（）方法中，数据将不会显示。我猜，因为异步管道稍后会订阅它

或者，通过重放最后一次发射，可观测对象应该是热可观测对象吗？但是我不知道怎么做，而且必须在ngondestry（）方法中取消订阅

是否应将其放入ngAfterViewInit（）生命周期挂钩中？然后它工作了，但我得到了著名的“表达式在检查后发生了变化”错误

---

以下是示例项目：

如果您希望主题直接发出，您应该使用

BehaviorSubject

，它将以默认值作为参数（

null

，在您的情况下），并在我们订阅后立即发出

---

另外，为了在本地过滤数据，使用一个更简单的方法，我用一个例子做了一个堆栈分支闪电战：

您的分析看起来不错。由于使用了主题，当管道订阅时，可能已经太晚了。那么，将主体替换为行为主体呢？每当有人订阅时，BehaviorSubject会自动给出上次收到的事件。您不能添加其他标志，例如：loaded$=new BehaviorSubject（false）；并在.CombineTest管道中输入一个值，您可以将其切换为加载$.next（true），并使用该值控制是否应在模板中可见谢谢。我正在使用--strictNullChecks并得到以下编译器错误：“类型为'null'的参数不可分配给类型为'void'的参数。”我是否应该使用“new BehaviorSubject（undefined）”，因为这似乎有效？那将是相同的是。实际上，在大多数情况下，您的主题类型将是您想要返回的，即

any[]

，在这种情况下，您可以使用

[]

作为更合理的默认值。好的，我理解。在这种情况下，我不需要任何返回值，所以我们可以使用type并返回undefined。

<div *ngIf="data$ | async as data">
  {{data |json}}
</div>

<button (click)="reload()">reload</button>
<button (click)="filter()">filter</button>

fetchFromServer$.next()
filter$.next();