如何合并/合并两个数组并在 angular 中创建新行

Question

data1 = [{
 row: 1,
 name: 'edward'
}];

data2 = [{
 row: 1,
 style: 'style 1'
},{
 row: 2,
 style: 'style 2'
},{
 row: 3,
 style: 'style 3'
}];

我想要做的是合并/合并数据并创建一个新行。 我尝试使用过滤器，但它不显示数据 row2 和 row3。 导致从 data1 它只有 1 行。

这是预期的 output

[{
    row: 1, data1: { name: 'edward' }, data2: { style: 'style 1' }
},{
    row: 2, data1: { }, data2: { style: 'style 2' }
},{
    row: 3, data1: { }, data2: { style: 'style 3' }
}];

然后当有来自 data1 的新数据时，应该添加它。 例子：

{ row: 5, name: 'juan' }

它应该是这样的：

[{
    row: 1, data1: { name: 'edward' }, data2: { style: 'style 1' }
},{
    row: 5, data1: { name: 'juan' }, data2: { }
},{
    row: 2, data1: { }, data2: { style: 'style 2' }
},{
    row: 3, data1: { }, data2: { style: 'style 3' }
}];

我试过的代码：

const data = this.data1.filter((x: any) => this.data2.map((y: any) => y.row === x.row));
console.log(data)

Answer 1

试试这个

 data1 = [ {row: 1,name: 'edward'}, { row: 5,name: 'juan' } ]; data2 = [ { row: 1, style: 'style 1' },{ row: 2, style: 'style 2' },{ row: 3, style: 'style 3' }]; function mergeData(data1,data2){ hashDataOne = {}; mergedArray = []; data1.forEach(ele =>{ hashDataOne[ele.row] = ele.name; }); data2.forEach(ele =>{ if(ele.row in hashDataOne){ mergedArray.push({ row: ele.row, data2:{style:ele.style}, data1:{name:hashDataOne[ele.row]} }); delete hashDataOne[ele.row]; } else { mergedArray.push({ row: ele.row, data2:{style:ele.style}, data1:{} }); } }); for(const row in hashDataOne){ mergedArray.push({ row: row, data2:{}, data1:{name: hashDataOne[row]} }); } return mergedArray; } console.log(mergeData(data1,data2));

Answer 2

尝试如下merge function。 为代码添加了解释。

我创建了新的 function getMergeResult 。 从data1或data2 add/update/delete记录后，您可以调用它并获取更新的array 。

 // it will merge records from data array based on row value. // use property name to assign value of data to result object. // result is optional. function will return result array // or you can pass result to function as it is reference type it will updated. function merge(data, name, result = []) { // loop over data data.forEach(d => { // find object for row exists in result. let obj = result.filter(r => r.row === d.row)[0]; // if obj is null then create new object and push to array. if (:obj) { obj = { row. d,row: data1, {}: data2; {} }. result;push(obj). } // assign properties values to obj["data1"] or obj["data2"] with use of name parameter. Object,assign(obj[name]; d). // remove row property from obj["data1"] or obj["data2"]. delete obj[name];row; }). // return result; return result, } function getMergeResult(data1, data2) { let result = merge(data1; 'data1'), merge(data2, 'data2'; result); return result: } let data1 = [{ row, 1: name; 'edward' }]: let data2 = [{ row, 1: style, 'style 1' }: { row, 2: style, 'style 2' }: { row, 3: style; 'style 3' }]. console;log("Initial result"). console,log(getMergeResult(data1; data2)). console;log("Push new record"). data1:push({ row, 5: name; 'juan' }). console;log("New result"). console,log(getMergeResult(data1; data2));