Как я могу использовать оператор фильтра rxjs? - PullRequest
Новая
       7

Как я могу использовать оператор фильтра rxjs?

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

У меня есть некоторый код, где я могу наблюдать. Я хочу изменить метод фильтра массива на фильтр rxjs. Как я могу использовать оператор фильтра rxjs? 


@Input() public articleTags: Observable<ALArticleTag[]>;
public selectedArticleTags: ALArticleTag[] = [];
public ngAfterViewInit(): void {
        this.articleTags.pipe(
            take(1),
            map(tags =>  {
                return this.selectedArticleTags = this.article.tagIds ? tags.filter(tag => {
                    return this.article.tagIds.includes(tag.id);
                }) : [];
            }),
        ).subscribe(response => {
            this.selectedArticleTags = response;
            this.changeDetection.markForCheck();
        });
    }

Ответы [ 2 ]

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

Из того, что я вижу, вы хотите отфильтровать теги, если это условие выполнено this.selectedArticleTags = this.article.tagIds и затем вы отфильтруете массив по этому условию tags.filter (tag => this.article.tagIds.includes (tag.id)) .

Код должен выглядеть следующим образом: 

@Input() public articleTags: Observable<ALArticleTag[]>;
public selectedArticleTags: ALArticleTag[] = [];
public ngAfterViewInit(): void {
        this.articleTags.pipe(
            take(1),
            filter(tags => this.selectedArticleTags = this.article.tagIds),
            map(tags => tags.filter(tag => this.article.tagIds.includes(tag.id));
            }),
        ).subscribe(response => {
            this.selectedArticleTags = response;
            this.changeDetection.markForCheck();
        });
    }
0 голосов
/ 29 октября 2019

Обратите внимание, что оператор фильтра в RxJS сильно отличается от собственного метода JavaScript Array.filter () .

Оператор фильтра RxJS позволяет вам

Фильтровать элементы, испускаемые источником Observable, выпуская только те, которые удовлетворяют указанному предикату.

Другими словами, оператор RxJS filter исключает наблюдаемое из потока, который встречаетопределенное условие, которое весьма отличается от того, что делает Array.filter(), которое заключается в фильтрации / удалении объектов или значений из массива на основе определенного условия.

Например, в приведенной ниже последовательности используется оператор RxJS filter() для отфильтровывания tags, длина которого меньше 1. 

this.articleTags
  .pipe(
    filter(tags => tags.length > 1),
  ).subscribe(res => {
    console.log(res);
    // do the rest
  })

Следовательно, результирующий вывод при наблюдаемых значенияхбыло бы возвращено articleTags, длина которого больше 1.

Следовательно, я не думаю, что вам следует использовать оператор RxJS filter для замены операции фильтрации внутри оператора map().

...