将对象合并到具有匹配ID的数组 - 角度2+/Ionic 2+

Question

我有一个包含对象的数组。在这些对象中的每一个中，itemID都有另一个对象。例如

[ 
{object1: 123, hasObjects: {innerObjectID: 1, type: red} 
{object2: 124, hasObjects: {innerObjectID: 2, type: blue} 
{object3: 125, hasObjects: {innerObjectID: 2, type: blue} 
{object4: 127, hasObjects: {innerObjectID: 1, type: red} 
] 

hasObjects是我内心的对象。我从另一个端点检索到其他对象，并且我想根据那个innerObjectID将这些数据组合到这个数组中。下面是其他物体的样子 - 每一个都是它自己的API调用

{ innerObjectID: 1, data: 1231231209381029381 } 
{ innerObjectID: 2, data: 13464531209381029381 } 

我想这些数据组合成阵列上方。所以我会查看该数组并添加基于ID的对象。

我想要什么：

[ 
    {object1: 123, hasObjects: {innerObjectID: 1, type: red, data: 1231231209381029381} 
    {object2: 124, hasObjects: {innerObjectID: 2, type: blue, data: 13464531209381029381} 
    {object3: 125, hasObjects: {innerObjectID: 2, type: blue, data: 13464531209381029381} 
    {object4: 127, hasObjects: {innerObjectID: 1, type: red, data: 1231231209381029381} 
    ] 

Component.ts

setItems(){ 

    this.service.setItems().subscribe((res) => { 
     this.items = res 

     this.stops.map(res => { 
     this.getIcons(res.hasObjects) 

     })  
    }) 
    } 

    getIcons(iconID){ 
     this.service.getIcons(iconID.imageID).subscribe(icon => { 
      this.newIcons = icon 

       icon.data = 'data:image/png;base64,' + icon.data; 
       let newObj = Object.assign(iconID.imageID, this.newIcons.innerObjectID) 
       console.log(newObj, 'new object') 
     }) 
    } 

什么上面发生的事情是，我刚刚起步的结果，并不能添加相关物体内部的对象。

Answer 1

您的对象的结构有点令人困惑，但作为一般规则，您可以为阵列中的每个对象发送请求。然后，您可以使用Promise.all在所有请求返回后执行代码，并从那里构建新的数组。

它可能类似于此

const requests = [] 

objects.map(object => { 
    // Assuming this.getOtherObject() returns an observable with an object 
    // with the following signature { innerObjectID: 1, data: 123 } 
    requests.push(this.getOtherObject(object.hasObjects.innerObjectID).toPromise()) 
}) 

Promise.all(requests).then(res => { 
    const newItems = [] 

    // res is an array containing all the responses from the requests 
    res.map(innerObject => { 
    const object = objects.find(
     object => object.hasObjects.innerObjectID === innerObject.innerObjectID 
    ) 

    newItems.push({ 
     ...object, 
     hasObjects: { ...object.hasObjects, data: innerObject.data } 
    }) 
    }) 

    this.items = newItems 
}) 

我没有测试的代码，但希望这给你如何做到这一点的想法。

Answer 2

在地图函数中使用promise并不是一个好主意，因为map函数需要一些地图来映射，但是当您向服务器发送请求时，您只有承诺。没有地图功能。只需遍历你的数组并发送所有项目的请求。此代码应该可以工作：

setItems(){  
    this.service 
     .setItems() 
     .subscribe((res) => { 
      this.items = res; 

      this.items.forEach((item, i, arr) => { 
      this.getIcons(arr[i]);//here we pass by reference 
      });  
     }); 
} 

getIcons(item){ 
     this.service 
      .getIcons(item.hasObjects.innerObjectID)//null check here 
      .subscribe(icon => { 
       item.hasObjects.data = icon.data; 
     }) 
    }