A single Arrayobject for presentation and modification

Question

Hello, I’m venturing into Angular 8, and I came across a stalemate, I get the following obj array of a service:

this.productsService.getProducts().subscribe(
      (products: Product[]) => {
         this.productsToShow = products;
         this.productsToEdit = products;
         // ja tentei fazer = [...products], etc
      });

and whenever I edit the object form productsToEdit, automatically the display grid is modified, in the grid there is a ngfor and being exhibited in the conventional way {{ element.atributo }}, there is some way to "freeze" the display?

Answer 1

The problem seems to be that you’re copying the same reference, try so:

this.productsToShow = {...products};
this.productsToEdit =Object.assign({}, products);

Or to have totally another object:

 this.productsToShow =JSON.parse(JSON.stringify(products));