首页 > 解决方案 > Ionic 3 - 如何使用 valueChanges Observable 合并对象数组

问题描述

我有两个对象数组来合并它们。第一个是 snapshotChanges 检索的结果(参与者),第二个是 valueChanges 检索的结果(usersRoom)。

//First one (participants)
participants = [
  {id: 123, message: 'OK'},
  {id: 456, message: 'Hey'}
];

//Second one (usersRoom)
for(var i=0; i < this.participants.length; i++){
  this.room = this.db.object('users/' + this.participants[i].id).valueChanges();
  this.room.subscribe(
     res => {
        this.usersRoom.push(res);
     });
}

但是当我尝试合并它们时,使用下面的代码,这将返回一个空数组:

this.final = this.usersRoom.reduce((arr, e) => {
      arr.push(Object.assign({}, e, this.participants.find(a => a.id === e.id)))
      return arr;
}, [])

我检查了我是否创建了一个假对象而不是获取 valueChanges,只是为了验证运行上述合并的代码,并且运行良好。

当我在结果中运行 console.log 时,我注意到它们在控制台上以不同的方式出现(请参阅每个的第一行):

//participants
(2) [{…}, {…}]
 0: {id: "123", message: "OK"}
 1: {id: "456", message: "Hey"}
//usersRoom
[]
 0: {name: "John", age: "28", id: "123"}
 1: {name: "Mary", age: "32", id: "456"}

在我看来,两者的格式不同,所以它们最终没有被合并。那么我该怎么做才能合并它们呢?

标签: javascriptfirebase-realtime-databaseionic3angularfire2

解决方案


如果我理解正确,你正试图得到这个

merge(){
    let ids = [];
    let merge_obj = [];

    let participants = [
      {id: 123, message: 'OK'},
      {id: 456, message: 'Hey'}
    ];

    let usersRoom = [
      {name: "John", age: "28", id: "123"},
      {name: "Mary", age: "32", id: "456"}
    ];

    participants.map( (obj) => {
      let index = ids.indexOf(obj.id);
      if( !( index > -1 ) )
      {
        ids.push(obj.id.toString());
      }
    });

    usersRoom.map( (obj) => {
      let index = ids.indexOf(obj.id);
      if( !(index > -1 ) )
      {
        merge_obj.push(obj);
      }
      else
      {
        let keys : Array<string> = Object.keys( obj );
        let objMerge = participants.filter( o => {
          if( o.id.toString() == obj.id )
          {
              let keysMerge : Array<string> = Object.keys( o );
              keysMerge.forEach( value => {
                if ( keys.indexOf(value) == -1 ) {
                  obj[value]=o[value];
                }
              });
          }
          return obj;
        })
        merge_obj.push(obj);
      }
    });
    console.log(merge_obj);
  }

合并对象

0: {name: "John", age: "28", id: "123", message: "OK"}
1: {name: "Mary", age: "32", id: "456", message: "Hey"}

推荐阅读