Question

我的问题是，我应该使用哪些地图运算符将每个对象转换为数组？

首先，我从朋友节点检索用户密钥，如下图所示。

我想使用这些密钥从用户节点获取我的好友列表。但是，结果将作为单独的对象返回，如下图所示。

因此，我无法迭代这些数据来显示视图。

我不确定这种做法是否是正确的做法。

这是我到目前为止所做的代码。

    getMyFriendList() {
      this.userService.getMyFriendKeys().switchMap(data => {
        console.log('TEST', data);
        return data;
    }).subscribe(friend => {
      this.userService.getFriends(friend.key).subscribe(res => {
        console.log('TEST2', res);
        // res is an objects
      });
    });
  }

friends.json：

{
  "5NnRVze6TVUeunLV0KXVmLby03J2": {
    "VkwT5IgS7ZYqDZ4uz5Dh76inrAK2": true,
    "dm8o0podI3gou0ob3wirkiyOGOu1": true
  },
  "VkwT5IgS7ZYqDZ4uz5Dh76inrAK2": {
    "5NnRVze6TVUeunLV0KXVmLby03J2": true
  },
  "dm8o0podI3gou0ob3wirkiyOGOu1": {
    "5NnRVze6TVUeunLV0KXVmLby03J2": true
  }
}

Users.json：

{
  "5NnRVze6TVUeunLV0KXVmLby03J2": {
    "currentActiveStatus": "online",
    "displayName": "Jeff Kim",
    "email": "ziznzkak@gmail.com",
    "photoURL": "https://firebasestorage.googleapis.com/v0/b/chattycherry-3636c.appspot.com/o/user-default.png?alt=media&token=f85be639-9a1c-4c79-a28d-361171358a41",
    "statusMessage": "",
    "uid": "5NnRVze6TVUeunLV0KXVmLby03J2",
    "username": "helloworld"
  },
  "VkwT5IgS7ZYqDZ4uz5Dh76inrAK2": {
    "currentActiveStatus": "offline",
    "displayName": "John Doe",
    "email": "hahehaheha@naver.com",
    "photoURL": "https://firebasestorage.googleapis.com/v0/b/chattycherry-3636c.appspot.com/o/profilepics%2FVkwT5IgS7ZYqDZ4uz5Dh76inrAK2?alt=media&token=e9c2a8dc-5a10-42a7-a9c9-b28d53776f12",
    "statusMessage": "programming is awesome!",
    "uid": "VkwT5IgS7ZYqDZ4uz5Dh76inrAK2",
    "username": "hello"
  },
  "dm8o0podI3gou0ob3wirkiyOGOu1": {
    "currentActiveStatus": "offline",
    "displayName": "Sia ",
    "email": "ziznzkak4@daum.net",
    "gender": "Female",
    "photoURL": "https://firebasestorage.googleapis.com/v0/b/chattycherry-3636c.appspot.com/o/profilepics%2Fd65DhlrcCGaayOBaF2siVhauQbq1?alt=media&token=19e2b040-0fd9-4f59-9d56-406a817f58a3",
    "statusMessage": "Hmm?",
    "uid": "dm8o0podI3gou0ob3wirkiyOGOu1",
    "username": "hellowo"
  }
}

Answer 1

您可以使用Object.keys()：

如果您想在并行呼叫getFriends()并获取好友的所有详细信息，可以使用Observable.forkJoin()：

this.userService.getMyFriendKeys()
    .switchMap(data => {
        return Observable.forkJoin(Object.keys(data).map(x => this.userService.getFriends(x.key)));
    })
    .subscribe(friends => {
        //friends is an array of items
        console.log(friends[0].displayName)//gives John Doe
    })

诀窍是在调用.map()后使用.getMyFriendKeys()返回一个Observable数组。请注意，.map()是数组的函数，而不是可观察的函数。

Answer 2

我自己想通了。我应该使用combineLatest（）方法。首先，从firebase中提取两个不同的对象可观察对象，然后将朋友对象可观察对象组合到一个名为this.friends的新可观察对象中。这会产生一个可观察的数组，我可以在模板中迭代。

感谢您的帮助CozyAzure。

    getMyFriendList() {
      this.userService.getMyFriendKeys().switchMap(data => {
        return Observable.combineLatest(data.map(x => this.userService.getFriends(x.key)));
    }).subscribe(friends => {
        this.friends = friends;
    });
  }

如何将每个用户对象合并到一个数组的可观察对象？

2 个答案: