How to merge the array value same id object in angular6?

Question

Here I am getting a response from my angular project

const testArray = [
{PackageID: 7, FormsList: [{Form_Name: "string One"}]}
{PackageID: 7, FormsList: [{Form_Name: "string Two"}]}
{PackageID: 7, FormsList: [{Form_Name: "string Three"}]}

{PackageID: 11, FormsList: [{Form_Name: "string One"}]}
{PackageID: 11, FormsList: [{Form_Name: "string One"}]}
{PackageID: 11, FormsList: [{Form_Name: "string One"}]}]

After getting this array I want to merge with the FormsList array in the same Id like below

const testArray = [
{PackageID: 7, FormsList: [{Form_Name: "string One"}, {Form_Name: "string Two"}, {Form_Name: "string Three"}]}  
{PackageID: 11, FormsList:  [{Form_Name: "string One"}, {Form_Name: "string Two"}, {Form_Name: "string Three"}]}]

and After merged how to remove the particular FormList>Form_Name selected object.

For example, I am getting deleted value like this

const deleteArray = [{PackageID: 7, FormsList: [{Form_Name: "string Two"}]}]

The test array result is without a second object like below code

const testArray = [{PackageID: 7, FormsList: [{Form_Name: "string One"}, {Form_Name: "string Three"}]}, {PackageID: 11, FormsList:  [{Form_Name: "string One"}, {Form_Name: "string Two"}, {Form_Name: "string Three"}]}]

Please help on this.

update screenshot

to be clear this has nothing to do with angular, follow up question: *will FormsList element would only have `formName` property?* — Pankaj Parkar, May 21 '19 at 14:15
It has other property also but I want to send an API input above JSON stringify format only. — imjayabal, May 21 '19 at 14:17
Can you explain the deletion after merging? I couldn't get what you wrote. You want to delete the item in `deleteArray` from `testArray`? — MonkeyScript, May 21 '19 at 14:19
Sure. Please think a checkbox (mat-checkbox) value for FormsList when I select I will push the value in an array. If I uncheck the checkbox want to remove the value from the updated array. Hope you understand. — imjayabal, May 21 '19 at 14:21
@imjayabal So you want to delete the items in deleteArray from testArray? Is that correct? — MonkeyScript, May 21 '19 at 14:22
Your data is not in a valid format, it changes when you supposedly "group" it, you ask to "delete" an item but want to keep it, and after keeping it, you want to inject it back into your array ... You don't make any sense. Please provide a [mcve] of your issue, and the data + expected result. — , May 21 '19 at 14:24
Possible duplicate of [Remove duplicates from an array of objects in JavaScript](https://stackoverflow.com/questions/2218999/remove-duplicates-from-an-array-of-objects-in-javascript) — Vikas, May 21 '19 at 14:35

MonkeyScript · Answer 1 · 2019-05-21T14:54:13.607

Merging, Note : use let instead of const

let tempArr : {
  PackageId : number,
  FormsList : {
    Form_Name : string
  }[]
}[] = []

// Iterate over test array
for(let testItem of testArray){
    // Check if item id exist
    if(tempArr.find(i=>i.PackageId==testItem.PackageID)){
        // Itearte over form list
        for(let testItemForm of testItem.FormsList){
      tempArr.find(i=>i.PackageId==testItem.PackageID).FormsList.push(testItemForm)
        }
    }else{
        tempArr.push({
            PackageId : testItem.PackageID,
            FormsList : testItem.FormsList
        })
    }
}

// Copy back
testArray = tempArr

Removal,

// Iterate over test array
for(let testItem of testArray){
    // Itearte over delete array
    for(let deleteItem of deleteArray){
        // Check if id matches  
        if(testItem.PackageID == deleteItem.PackageID){
            // Itearte over delete form list
            for(let deleteItemForm of deleteItem.FormsList){
                // Filter form list of test item
                testItem.FormsList = testItem.FormsList.filter(f=>f.Form_Name!=deleteItemForm.Form_Name)
            }
        }
     }
}

First I want to merge the testArray like this const testArray = [ {PackageID: 7, FormsList: [{Form_Name: "string One"}, {Form_Name: "string Two"}, {Form_Name: "string Three"}]} {PackageID: 11, FormsList: [{Form_Name: "string One"}, {Form_Name: "string Two"}, {Form_Name: "string Three"}]}] — imjayabal, May 21 '19 at 14:39

score 1 · Answer 2 · answered May 21 '19 at 14:37

So, let's start! The first thing what we should do is create a list of PackageID's

const ids = testArray.map(item => item.PackageID)

and then let's get unique values from this array. For this, we need to make to two step's

Create a function distinct

const distinct = (value, index, self) => {
    return self.indexOf(value) === index
}

Create list of uniq id's

const uniqIds = ids.filter(distinct)

Now we able to merge testArray

const res = uniqIds.map(id => {
    let tmp = []
    const arr = testArray.filter(item => item.PackageID === id)

    arr.forEach(item => {
        tmp.push(...item.FormsList)
    })

    return { PackageID: id, FormsList: tmp }
})

I hope it will help you

Let me try Igore Bezsmertnyi – imjayabal May 21 '19 at 14:51 — imjayabal, May 21 '19 at 14:51

How to merge the array value same id object in angular6?

2 Answers2