Фильтрация массива с помощью RXJS

Question

Я пытаюсь отфильтровать возврат HTTP-запроса в Angular 7, используя RXJS6.

Я должен отфильтровать ответ;получить только пользователей с IdSkill равным 1234.

Однако я не могу этого добиться.Я только что получил эту ошибку:

Тип «Наблюдаемый» не может быть назначен типу «Наблюдаемый>».Типу «Пользователь []» не хватает следующих свойств из типа «Пагинация»: всего, предметов

RXJS - не мой сильный навык;Я просто использую основы, только для выполнения простых запросов HTTP get / post.

Мой код:

/* Interface */
export interface Pagination<t> {
    total: number;
    items: t[];
}

export interface User {
    idUser: number;
    name: string;
    active: boolean;
    skill: Skill;
}

export interface Skill {
    idSkill: number;
    name: string;
}

/* Service */
getUsers(): Observable<Pagination<User>> {
    return this._httpClient.get<Pagination<User>>(
      'http://localhost/api/users',
      { headers: this._auth }
    ).pipe(
      filter(x => x.items.filter(user => user.skill.idSkill == 1234))
    );
}

Спасибо

Answer 1

Оператор, который вам нужен, будет map, так как вы хотите переназначить (отфильтровать) свой внутренний результат.RxJs filter используется, когда вы хотите отфильтровать сам результат, полученный от Observable.

import { map } from 'rxjs/operators';


/* Service */
getUsers(): Observable<Pagination<User>> {
    return this._httpClient.get<Pagination<User>>(
      'http://localhost/api/users',
      { headers: this._auth }
    ).pipe(
      map((pagination: Pagination<User>) => ({
         ...pagination,
         items: pagination.items.filter(user => user.skill.idSkill == 1234)
      }))
    );
}

Answer 2

Ваша конечная точка возвращает то, что возвращается, поэтому просто используйте find, чтобы получить единственное совпадение.Или filter, чтобы получить массив совпадений.

getUsers(): Observable<Pagination<User>> {
    return this._httpClient.get<Pagination<User>>(url,{ headers: this._auth })
       .pipe(take(1))
       .subscribe(users => {

            // finds a single result
            theObject = users.find(obj => obj.IdSkill == 5);

            // return an array of all matching results
            arrayOfResults = data.filter(obj => obj.IdSkill === 'JavaSc');

       });
}