0

我试图让我的 observable 在分页期间自动更新。

仅页面触发器

当load()被调用时，页面可观察对象被触发，但订阅可观察对象在更新时不会被触发......

pageSub = new BehaviorSubject<number>(1);
page = 1;

// in constructor...

this.posts = this.pageSub
  .pipe(
    mergeMap((page: number) => this.urql
      .subscription(this.GET_POSTS,
        {
          first: this.ITEMS.toString(),
          offset: (this.ITEMS * (page - 1)).toString()
        }
      )
    ),
    scan((acc, value) => [...acc, ...value]),
  );

// called from button

load() {
  this.page += 1;
  this.pageSub.next(this.page);
}

仅订阅触发器

这里确实触发了订阅更改，但是load()调用时，不会触发页面更改...

this.posts = combineLatest([this.pageSub, this.urql
  .subscription(this.GET_POSTS,
    {
      first: this.ITEMS.toString(),
      offset: (this.ITEMS * (this.page - 1)).toString()
    }
  )]).pipe(
    map((arr: any[]) => arr[1])
  );

当然，有一种方法可以通过页面更改和订阅更改来更新 Observable？

我应该补充一点，重置变量声明this.posts不起作用，因为它刷新了页面并且不是预期的行为。

有任何想法吗？

谢谢，

Ĵ

4

1 回答 1

0

知道了：

mainStream: BehaviorSubject<Observable<any>>;

posts!: Observable<any>;

constructor(private urql: UrqlModule) {

  this.mainStream = new BehaviorSubject<Observable<any>>(this.getPosts());

  this.posts = this.mainStream.pipe(mergeAll());

}

async load() {
  this.page += 1;
  this.mainStream.next(this.combine(this.mainStream.value, this.getPosts()));
}

getPosts() {
  return this.urql.subscription(this.GET_POSTS,
    {
      first: this.ITEMS.toString(),
      offset: (this.ITEMS * (this.page - 1)).toString()
    }
  )
}

combine(o: Observable<any>, o2: Observable<any>) {
  return combineLatest([o, o2]).pipe(
    map((arr: any) => arr.reduce((acc: any, cur: any) => acc.concat(cur)))
  );
}
于 2021-03-23T04:52:19.603 回答