Angular 6 - update deep object inside array

Question

i have a config object to send from X component to Y component

from the Y component i filter the columns to get only the unique monoselect, then for each column i want to update the options of monoselectConfig.

the problem is that i can update the options but when i display the config object i don't find the modifications i just made

stackblitz

  config = {
    value: this.result,
    columns: [
      {
        field: "speciality",
        type: "monoselect",
        monoselectConfig: { options: this.options },
        unique: true
      }
    ]
  }

I hope the below answer resolved your issue, if so please upvote as well so that it could be useful to others also. — Minal Shah
– Minal Shah, Commented Jul 6, 2020 at 7:09

Minal Shah · Accepted Answer · 2020-07-05 17:56:09Z

you were doing the filtering correctly but you were not updating the object properly.

I have reviewed your code in the stackblitz, you just need minor changes in your ngOnChanges() method.

So just update your ngOnChanges() method by the below code. This would update your configurations object as well.

ngOnChanges(changes: SimpleChanges) {
    if (changes["config"] && changes["config"].currentValue) {

      this.configuration = changes["config"].currentValue;

      // get all unique monoselect
      let monoselectsUnique = this.configuration.columns.filter(element => element.type === "monoselect" && element.unique == true);
      console.log(monoselectsUnique)
      if (monoselectsUnique.length > 0) {
        monoselectsUnique.forEach(element => {

          // get all options not exist in the array result
          let newOption = element.monoselectConfig.options.filter(item => !this.config.value.map(item => item[element.field].code).includes(item.code));

          // update the config object with the new option
          // monoselectsUnique = { ...monoselectsUnique.monoselectConfig, options: newOption }
          element.monoselectConfig.options= newOption
        })
         console.log(monoselectsUnique)
        console.log(this.configuration)
      }

    }
  }

Collectives™ on Stack Overflow

Angular 6 - update deep object inside array

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related