CODEWITHSUNDEEP
angulartypescript
Miomir Dancevic
Miomir Dancevic

Reputation: 6852

Update value in array based on same id in angular

I have this array 

const buildings = [
  { id: 111, status: false, image: 'Test1' },
  { id: 334, status: true, image: 'Test4' },
  { id: 243, status: false, image: 'Test7' },
  { id: 654, status: false, image: 'Test9' },
  { id: 222, status: true, image: 'Test8' }
];

What I need is to update same value based on new porperti

cons newBuilding = { id: 111, status: true, image: 'Test1' };

I need a function that will handle like that like this

    mergeSelectedBuildings(building) {
    if (buildings.length >= 0) {
      buildings.push(building);
    } else {
      buildings.map((buildingValue, i) => {
        if (buildingValue.id === building.id) {
          this.buildings[i].status = building.status;
          this.buildings[i].image = building.image;
        } else {
          this.buildings.push(building);
        }
      });
    }
  }

The problem is that this does not work as expected, it always add new and new value it does not update:(

Upvotes: 0

Views: 2124

Answers (4)

Damian Plewa
Damian Plewa

Reputation: 1193

You need to find object from array that is equal to id, then if it's not existing in array, you need to push it, else you need to update values of existing building object

mergeSelectedBuildings(newBuilding) {
  const currentBuilding = buildings.find(building => building.id === newBuilding.id);
  if (!currentBuilding) {
    buildings.push(newBuilding);
    return;
  }
  currentBuilding.status = newBuilding.status;
  currentBuilding.image = newBuilding.image;
}

Example of usage:

console.log(buildings);

mergeSelectedBuildings(newBuilding);

console.log(buildings);

output:

[
  { id: 111, status: false, image: 'Test1' },
  { id: 334, status: true, image: 'Test4' },
  { id: 243, status: false, image: 'Test7' },
  { id: 654, status: false, image: 'Test9' },
  { id: 222, status: true, image: 'Test8' }
]
[
  { id: 111, status: true, image: 'Test1' },
  { id: 334, status: true, image: 'Test4' },
  { id: 243, status: false, image: 'Test7' },
  { id: 654, status: false, image: 'Test9' },
  { id: 222, status: true, image: 'Test8' }
]

Upvotes: 1

Ron Rofe
Ron Rofe

Reputation: 796

Try using this function:

const buildings = [
   ...
];

const update = (item: { id: number, status: boolean, image: string }): void {
   const index = buildings.findByIndex(current => current.id === item.id);
   if(index !== -1) {
      buildings[index] = item;
   }
}

Upvotes: 0

Kurt Hamilton
Kurt Hamilton

Reputation: 13515

I wouldn't use the map array function like this. Instead, try to find the item and update that object. If the item isn't found, push the building to the array.

mergeSelectedBuildings(building) {
  const existing = this.selectedBuildings.find(x => x.id === building.id);
  if (existing) {
    existing.status = building.status;
    existing.image = building.image;
  } else {
    this.selectedBuildings.push(building);
  }
}

Upvotes: 3

Shlok Nangia
Shlok Nangia

Reputation: 2377

please try this snippet

const buildings = [
  { id: 111, status: false, image: 'Test1' },
  { id: 334, status: true, image: 'Test4' },
  { id: 243, status: false, image: 'Test7' },
  { id: 654, status: false, image: 'Test9' },
  { id: 222, status: true, image: 'Test8' }
];


const newBuilding = { id: 111, status: true, image: 'Test1' };

var b = buildings.find(e => e.id == newBuilding.id)
b.image = newBuilding.image
b.status = newBuilding.status
console.log(buildings)

this finds the building by id property

Upvotes: 0

Related Questions