时间戳

首页 > 解决方案 > 使用 RXJS 过滤数组

javascript - 使用 RXJS 过滤数组

问题描述

我正在尝试使用 RXJS6 在 Angular 7 中过滤 HTTP 请求的返回。

我必须过滤响应；仅获取 IdSkill 等于 1234 的用户。

但是，我无法做到这一点。我刚收到这个错误：

类型“Observable”不可分配给类型“Observable>”。类型“用户 []”缺少“分页”类型的以下属性：总计、项目

RXJS不是我的强项；我只是使用基础知识，只做简单的 get/post HTTP 请求。

我的代码：

/* 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))
    );
}

谢谢

标签： javascriptangularrxjsobservablerxjs6

解决方案

您需要的运算符是 a map，因为您想重新映射（过滤）您的内部结果。filter当您想要过滤从 Observable 发出的结果本身时，使用RxJs 。

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)
      }))
    );
}

推荐阅读