Добавление данных к состоянию в угловом NGXS - PullRequest
Новая
       57

Добавление данных к состоянию в угловом NGXS

0 голосов
/ 21 октября 2019

У меня проблема с тем, как я могу добавлять новые данные, так как я делаю прокрутку на стороне сервера. Сообщения удаляют старые данные при поступлении новых данных, НО я просто хочу, чтобы новые данные добавлялись, а не удалялись старые данные в сообщениях

TS 

  page = 1;

    constructor(private store: Store) {
        this.store.dispatch(new GetPostsPerPage('', this.page.toString()));
    }

     onScroll() {
        this.store.dispatch(new GetPostsPerPage('', (this.page += 1).toString()));
      }

Штат 

@Action(GetPostsPerPage)
      getPostsPerPage(ctx: StateContext<PostStateModel>, { key, pageNumber }: GetPostsPerPage) {
        return this.postsService.getPostsPerPage(key, pageNumber).pipe(
          tap((result: Post[]) => {
            console.log(result);
            ctx.patchState({
              posts: result['data'],
            });
          }),
          catchError(err => {
            console.log(err);
            return throwError(err);
          })
        );
      }

1 Ответ

1 голос
/ 22 октября 2019

Когда вы исправляете состояние, вам нужно добавить результаты к текущему значению состояния, а не переопределять его с помощью posts: result['data'].

. В вашем операторе tap вы можете использовать спред для добавленияновые сообщения: 

var currentPosts = ctx.getState().posts;
ctx.patchState({
 posts: [...currentPosts, ...result['data']]
});

NGXS также имеет некоторые (относительно новые) встроенные операторы состояний , которые облегчают обработку этих сценариев, см. документацию , в частности append оператор.

...