Question

所以基本上我想做的是更新一个数组以显示它，一个可观察对象是一个Behavior主题，它从一个空数组开始，然后从HTTP请求中获取一个新值，另一个是来自Angular材质分页器的事件发射器，如果第一个可观察对象获得了一个新数组，或者第二个可观察对象发出了更改页面的事件，则所需的行为是更新列表。

我尝试的第一种方式是：

connect(): Observable<Transaction[]> {
     return this.paginator.page.pipe(
    map(() => {
       return this.list.pipe(map(t => this.getPagedData(t)));
    }),
    switchMap(m => m) // or mergeMap
);
}

它可以工作，问题在于它第一次不发出任何东西是因为它等待外部可观察到的东西发出东西，然后才起作用。

然后我尝试

return merge(this.list, this.paginator.page).pipe(
  map(x => this.getPagedData(x[0])),
);

但是这个似乎只是在数组为空时第一次发出

Answer 1

您可以使用startWith运算符，即使可观察到的源未发出第一个值，该运算符也会发出一个值（默认为null）。

来自RxJs文档：

startWith -返回一个Observable，它在开始发射之前先发射您指定为参数的项目。

所以你会有类似的东西

connect(): Observable<Transaction[]> {
   return this.paginator.page.pipe(
      startWith(),
      map(() => this.list.pipe(map(t => this.getPagedData(t))),
      switchMap(m => m) // or mergeMap
  );
}

Answer 2

听起来像combineLatest的工作，请尝试更改此代码。

return combineLatest(this.list, this.paginator.page).pipe(
  map(x => this.getPagedData(x[0])),
);

Answer 3

我认为您的第一种方法很有意义，但只需要this.paginator.page来发出一个初始值即可。我建议将其包装如下：

this.page=this.paginator.page.pipe(startWith(1),shareReplay(1))

将this.page用于外部流，则您始终会有一个起始值，并且也会收到更新通知

Rxjs根据两个可观察对象更新列表

3 个答案: