不使用ngrx存储的DataSource加载方法

Question

如何在ngrx存储中使用DataSource加载方法？

我有以下问题: 1.当页面加载时，加载方法被称为2.无限加载3. 2请求被发送到服务器，而不是1。

如果我直接使用这项服务，那就没有问题了。

TypeScript:

this.ds = new CustomStore({
  load: (loadOptions: any) => {
    this.myFacade.loadAllRecords(this.filter, loadOptions);
    return this.myFacade.records$
      .toPromise()
      .then(result => {
        return result;
      });
  }
});

​

​

this.ds = new CustomStore({
  load: (loadOptions: any) => {
    this.myFacade.loadAllRecords(this.filter, loadOptions);
    return new Promise(resolve => this.myFacade.records$
      .pipe(takeUntil(this.unsubscribe$)).subscribe(resolve)).then(result => {
        return result;
      });
  }
});

​

​

export class MyFacade {
  public records$: Observable<any>;
  constructor(private store: Store<State>) {
    this.records$ =
      this.store.pipe(select(myQuery.getRecords));
  }
  loadAllRecords(model: myModel, loadOptions?: LoadOptions) {
    this.store.dispatch(new LoadRecords(model, loadOptions));
  }
}

Answer 1

我认为问题是你可观察到的records$还没有完成。而toPromise()仍在等待可观测结果的解算。

我要做以下几点：

在外观中添加take(1)

this.records$ =
  this.store.pipe(
    select(myQuery.getRecords),
    take(1)
  );

然后更改CustomStore

this.ds = new CustomStore({
  load: (loadOptions: any) => {
    this.myFacade.loadAllRecords(this.filter, loadOptions);
    return this.myFacade.records$
      .pipe(
        takeUntil(this.unsubscribe$)
      ).toPromise();
  }
});