Как использовать множественные абонентские вызовы в компоненте без переопределения данных всех абонентских вызовов - PullRequest
Новая
       7

Как использовать множественные абонентские вызовы в компоненте без переопределения данных всех абонентских вызовов

0 голосов
/ 30 августа 2018

Я использую 3 службы API на разных вкладках mat-tab, но когда я переключаюсь между вкладками, я получаю данные, объединенные из всех 3 API.

Я определил три функции в компоненте, в котором я вызываю разные API во всех разных функциях и вызываю 3 функции в ngOninit (). При печати извлеченных данных в консоль я получаю данные, добавленные друг к другу.

Например, если функция 1 имеет 20 записей, функция 2 имеет 3, а функция 3 также имеет 3.

Таким образом, если сначала выполняется функция 1, то будет зарегистрировано 20 записей, после этого, если будет выполнена функция 2, будет зарегистрировано 20 + 3 = 23 записи (тогда как здесь должны быть зарегистрированы только 3), и, наконец, когда выполняется функция 3, она возвращает 23 + 3 = 26 записей (здесь также должно быть только 3).

Попытка отписаться от функции после получения значения в определенной функции. Не смог этого сделать. 

constructor(private _server: ServerService) {}
ngOnInit(): void {
  this.f1();
  this.f2()
}

getf1(): void {
  this._server.getf1count()
       .subscribe(exeJened => {
      this.exeJened = exeJened
      console.log('exe',this.exeJened)
     })
}
getf2(): void 
{
  this._server.getf2count()
       .subscribe(queJened => {
      this.queJened = queJened
    console.log('que',this.queJened) }

     })
}

Результат exe: массив из 20 записей Результат que: массив из 23 записей тогда как exe имеет 20, а que имеет 3 записи. Не удалось загрузить скриншот.

Код для серверного сервиса: 

 constructor(private _http: HttpClient){}
getf1count():Observable<any>
  {
  return this._http.get(this.executed_URL)
  .pipe(
        map(exeresult=>exeresult['serverserials']),
        retry(4),
        catchError(this.handleError)
    )
  }
  getf2count():Observable<any>
  {
  return this._http.get(this.queued_URL)
  .pipe(
        map(queresult=>queresult['serverserials']),
        retry(4),
        catchError(this.handleError)
    )
  }
...