Как фильтровать наблюдаемый массив

#angular #typescript #rxjs

Вопрос:

Я изучаю RxJS. Я пытаюсь отфильтровать только те data элементы массива, код которых «ABC» и «XYZ», но получаю синтаксическую ошибку.

Это то, что я пытался:

     myApi(): void {
        this.myService.dropdownData()
        .pipe(
        map((data) => data.filter((item) => return {
          item.Code ==='ABC' || item.Code === 'XYZ'
        }))
        )
        .subscribe(
          data => {
           
            console.log('222', data);
          },
          error => {
            this.alert.error(error.error.Message);
          }
        );
      }
 

Комментарии:

1. Что вы хотите напечатать в console.log ? Что значит данные для вас ? У вас синтаксическая ошибка, потому что возвращаемое значение должно быть в скобках

Ответ №1:

Вы можете использовать сам оператор фильтра: https://www.learnrxjs.io/learn-rxjs/operators/filtering/filter

Так что вы можете попробовать это так:

 this.myService.dropdownData()
    .pipe(
      filter(item => item.Code === "ABC" || item.Code === "XYZ")
    )
)
 

Кроме того, вы уверены, что это .Code так, а не .code иначе ?

Комментарии:

1. не могли бы вы опубликовать структуру вашей модели модели (IConditionDropdownData) ?

2. Это решение не будет работать, потому что оно обрабатывает фильтрацию выдаваемых значений, а не array само по себе.

Ответ №2:

Нет никаких проблем с RxJS оператором, который вы используете, но, как вы сказали в своем вопросе , у вас есть синтаксическая ошибка, потому что вы используете return filter без скобок {} и используете скобки для обертывания неправильного оператора.

Поэтому вам просто нужно удалить return скобки и скобки {} , как показано ниже:

 myApi(): void {
  this.myService
    .dropdownData()
    .pipe(
      map((data) =>
        data.filter((item) => item.Code === 'ABC' || item.Code === 'XYZ')
      )
    )
    .subscribe(
      (data) => {
        console.log('222', data);
      },
      (error) => {
        this.alert.error(error.error.Message);
      }
    );
}
 

Комментарии:

1. Это решение также будет выдавать сигнал при изменении данных, но не отфильтрованного результата. Просто нужно кое-что иметь в виду. Возможно, использование filter оператора из RxJS является лучшим способом здесь, в зависимости от потребностей операций.

2. Он просто хочет отфильтровать результат array , который приходит из API, и исключить из него некоторые элементы, поэтому в этом случае не нужно использовать filter оператора!