Angular 2 和 RxJS：如何更改 returns Observable 的 HTTP 调用

Question

如何更改此函数以使用下面描述的 JSON 更改？

当前函数returns一个Observable<User[]>，但是随着新的JSON，新的admin对象已经被添加。新函数应该成功观察现有的 users 数组和新的 admins 数组。

getData(): Observable<User[]> {
  return this.http
    .get('www.example.com/api/users)
    .map((r: Response) => r.json().assets.users as User[]);
}

JSON 从 /api/users

返回

{
"assets": {
    "users": [
        // user objects
    ]
}

...现在 returns 两个数组，users 和 admins。

{
"assets": {
    "users": [
        // array of user objects
    ],
    "admins": [
        // array of admin objects
    ]

}

请假设我的代码确实已经创建了 User 和 Admin 类，它们正确反映了返回的相关 JSON 对象的属性。

Answer 1

嗯，你有几个选项如何return数据：

getData(): Observable<User[]> {
  return this.http
    .get('www.example.com/api/users')
    .map((r: Response) => { 
         const assets = r.json().assets;
         return {
             users: assets.users as User[],
             admins: assets.admins as Admin[]
         }
     });
}

或者像这样：

getData(): Observable<User[]> {
  return this.http
    .get('www.example.com/api/users')
    .map((r: Response) => { 
         return [
             assets.users as User[],
             assets.admins as Admin[]
         ]
     });
}

或者像这样：

getData(): Observable<User[]> {
  return this.http
    .get('www.example.com/api/users')
    .map((r: Response) => { 
         return [
             ...assets.users as User[],
             ...assets.admins as Admin[]
         ]
     });
}

Answer 2

如果你想 return 用户和管理员都在同一个数组中，下面的代码应该可以做到这一点：

getData(): Observable<User[]> {
  return this.http
    .get('www.example.com/api/users)
    .map((r: Response) => {
        var results = r.json();
        return results.assets.users.concat(results.assets.admins);
    }
}

具有以下数据：

{
"assets": {
    "users": [
        { "name": "bob" }, { "name": "john" }
    ],
    "admins": [
        { "name": "jill" }, { "name": "donald" }
    ]

}

结果将等于：

[ { "name": "bob" }, { "name": "john" }, { "name": "jill" }, { "name": "donald" } ]

正如我在对@Maximus 回答的评论中所解释的那样，.map() 用于将一个数组转换为一个新数组，这就是为什么您想向 .map() 提供一个函数来告诉它什么您要查找的数组。

Angular 2 和 RxJS：如何更改 returns Observable 的 HTTP 调用

Angular 2 and RxJS: How to change HTTP call that returns Observable

observable

rxjs

angular2-observables

angular