Как объединить новые наблюдаемые данные с предыдущими данными при каждом приращении страницы - PullRequest
0 голосов
/ 17 июня 2020

С помощью этого кода, когда я снова прокручиваю вызов api, и он извлекает как предыдущие данные, так и новые данные и объединяется вместе. Но я хочу только добавить новые наблюдаемые данные к существующему наблюдаемому --- с каждой прокруткой нового наблюдаемого данные, которые будут добавлены при увеличении страницы.

 onSearchOrder() {
  this.orders$ = this.getOrderData(this.page, this.limitOrder).pipe(
    map(res => res),
    catchError(error => throwError(error))
  )
 }    

 getOrderData(page, limitOrder): Observable<any> {
   this.orderApiData(page, limitOrder)
 }    

 orderApiData(params, page, limit) {
   let orderurl = `${xx}/xx/xx?page=${page}&limit=${limit}`;
   let headers = new Headers();
   headers.append("Accept", "application/json");
   let options = new RequestOptions({ headers: headers });
   return this.http.post(orderurl, params, options)
     .pipe(map(res => JSON.parse(res['_body']),
       catchError(err => {
         this.errorMessage = err.message;
         return EMPTY
       }))
     )
 } 

 doInfinite(infiniteScroll) {
   this.page = this.page + 1;
   setTimeout(() => {
     this.orders$ = combineLatest(this.orders$, this.getOrderData(this.page, this.limitOrder)).pipe(
       map(([firstResult, secondResult]) => {
         return [].concat(firstResult).concat(secondResult)
       })
     );
     console.log('Async operation has ended');
     infiniteScroll.complete();
   }, 1000);
 }

1 Ответ

0 голосов
/ 17 июня 2020
  1. Вы можете создать Subject, который будет источником всех прокручиваемых данных
  2. После этого вы можете создать Observable piped, используя scan , который будет обрабатывать накопленные logi c - каждый раз, когда вы генерируете новое значение для Subject, этот наблюдаемый будет соединять предыдущие данные с новым выданным значением.
  3. Подпишитесь на наблюдаемый, чтобы получить все данные.

Вот пример:

// 1.
ordersSubject$ = new Subject();

// 2.
orders$ = this.ordersSubject$.pipe(
    scan((a, b) => [...a, ...b], [])
)

Затем каждый раз, когда у вас появляются новые данные, просто отправляйте их через тему

this.getOrderData(this.page, this.limitOrder).subscribe(data => {
    this.ordersSubject$.next(data);
}); 

И чтобы использовать данные, подпишитесь в Observable:

orders$.subscribe(console.log)
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...