Фильтровать наблюдаемое в зависимости от идентификатора

Question

Я пытаюсь понять и работать с Observables , я заставил его работать, но теперь мне нужно отфильтровать данные внутри в зависимости от id, которые они имеют, например: данные, которые имеют l1: 1 и l2 : 2 должны быть сгруппированы так же, как данные, которые имеют
l1: 1,l2: 3,l3: 4

Какой подход является лучшим? Я пытался с .filter() и .distinct(), но не могу заставить его работать, должен ли я фильтровать внутри компонента или непосредственно внутри службы?

service.ts

  getStructure(): Observable<StructureInterface[]> {
    return this.httpClient.get<StructureInterface[]>(`someUrl`)
      .pipe(
        tap(data =>
        console.log('Get structure done ', data)),
        catchError(this.handleError)
      );
  }

interface.ts

export interface StructureInterface {
  parts: {
    part: string,
    l1: number,
    l2: number,
    l3: number,
    diam: Array<{}>;
    price1: number,
    price2: number
  },
  labels_levels: [string];
  labels_diameters: [string];
}

component.ts

  labels: any[];


  constructor(private httpClient: HttpClient,
              private activatedRoute: ActivatedRoute,
              private service: Service
              ) {
  }


//Call to service

  ngOnInit() {
      this.service.getStructure().subscribe(
        res => {
          this.labels = res;
          //I tried .filter() here
          console.log(this.labels)
        });

  }

Спасибо за вашу помощь

Answer 1

Подумайте о потоке данных здесь:

1. Входящий HTTP-ответ - нефильтрованный массив вещей
2. По однократной наблюдаемой http.get ()
3. Возвращено к вашему компоненту в виде массива объектов StructureInterface

Я думаю, вы хотите отфильтровать данные на шаге 3, что означает, что это проблема после завершения наблюдения, так что это просто фильтр массива. То, как вы фильтруете массив, зависит от того, какие данные вам нужны.

В этом примере будут храниться только объекты, где l1 равен 1:

this.service.getStructure().subscribe(res => {
  this.labels = res.filter(structure => structure.l1 === 1);
  // will only include array items with an l1 value of 1
  console.log(this.labels)
});

РЕДАКТИРОВАТЬ Чтобы ответить на ваш вопрос о том, где вы должны фильтровать, это зависит от вашего варианта использования. В идеале вы должны передать свои параметры id на сервер и выполнить там фильтрацию. Если вы не можете это контролировать, тогда вы можете применить фильтр внутри наблюдаемой карты ():

getStructure(l1: number): Observable<StructureInterface[]> {
    return this.httpClient.get<StructureInterface[]>(`someUrl`)
      .pipe(
        map(response => response.parts.filter(x => x.l1 === l1)),
        catchError(this.handleError)
      );
  }