如何映射两个不同的对象并在 angular 中的 ag-grid 中显示

how to map two different objects and display in ag-grid in angular

我正在提供示例工作数据并有两个对象

vlist=[
  {

    "city": "Mumbai",
    "offers": {
      "1": {
        "status": "true",
        "price": 100
      },
      "2": {
        "status": "true",
        "price": 100
      }
    }
  }
]

products=[
  {
    "productID": 1,
    "productName": "pespsi"
  },
  {
    "productID": 2,
    "productName": "coke
  },
  {
    "productID": 3,
    "productName": "thubs up"
  }

]

在上面提供的对象中,我需要将产品对象中的产品名称与产品 ID 映射到 "vlist" 中的相应对象。我的主要 objective 是如何使用 ag-grid 显示这些值。

这是我的专栏定义:

columnDefs = [{
    headerName: 'productname', field: 'productname', filter: true, resizable: true
  },{
    headerName: 'price', field: 'price', filter: true, resizable: true
  }, {
    headerName: 'status', field: 'status', filter: true, resizable: true
  }
];

期待这样的结果:

productname     price    status
pespsi          100      true
coke            100      true
thumbsup        100      true

这样的 Vlist:

vlist=[
  {

    "city": "Mumbai",
    "offers": {
      "pespsi": {
        "status": "true",
        "price": 100
      },
      "coke": {
        "status": "true",
        "price": 100
      }
    }
  }
]
var details = [];
for (var i = 0; i < products.length; i++) {
    var product = products[i];
    var item = vlist[0].offers[''+product.productID];
    details.push({
        productName: product.productName,
        ...item
    });
}

现在您应该将详细信息传递给 ag-grid。