Оператор RxJS take не работает с приложением Angular

Question

У меня есть преобразователь, который выбирает данные из службы и передает этот объект Observable компоненту, который подписывается и реализует преобразователь.

resolve (route: ActivatedRouteSnapshot): Observable<NewsAPIArticle[]> {
    return this.newsAPIService.getNewsAPIArticles()
        .pipe(
            catchError(error => {
                this.alertify.error('Problem retrieving news');
                return of(null);
            }),
            take(5)
        );
}

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

ngOnInit() {
    this.router.data.subscribe(data => {
      this.articles = data['news']['articles'];
      console.log(this.articles);
      this.language = 'en';
    });
  }

Однако вместо того, чтобы записывать в консоль 5 вещей, которые распознаватель должен «взять» из наблюдаемого, насколько я понимаю, массив возвращается с 20 объектами. Что я делаю не так в операторе take rxjs? Я не хочу все 20 ответов, только, может быть, 5.

Answer 1

Вы должны использовать карту со срезом,

 .pipe(...
   map(x => x.slice(0,5))
 ) 

Answer 2

take(5) означает, что он возьмет 5 элементов из потока. Массив - это отдельный элемент в потоке, поскольку наблюдаемое имеет тип NewsAPIArticle[]. Если наблюдаемая имеет тип NewsAPIArticle, и поток генерирует несколько статей, take(5) будет вести себя так, как вы ожидаете, но в действительности служба, которую вы вызываете, выдает все статьи сразу.