No meu componente tenho 2 objetos que utilizam o mesmo modelo, como abaixo:
Componente:
produtos: Produto[] = [];
produtosOriginal: Produto[] = [];
Em determinado momento faço a cópia dos valores:
this.produtosOriginal = this.produtos;
No HTML, eu faço um for e vinculo o input a propriedade:
HTML:
<ng-container *ngFor="let produto of produtos; let i = index;">
...
<input class="form-control form-control-sm"
type="number"
min="1"
step="1"
(focusout)="validarItem(produto.id)"
(input)="validarItem(produto.id)"
[ngClass]="{ 'is-invalid': produto.erroQtde }"
[(ngModel)]="produto.qtde" />
</ng-container>
Quando realizo uma alteração no input o valor é repassado para os 2 objetos, já verifiquei se esse valor está sendo passado por outro fator, mais com certeza o problema está com o [(ngModel)]. Como consigo atualizar somente o objeto produtos.
Observação:
- Estou utilizando Angular 8.
- Já tentei utilizar [(ngModel)]="produtos[i].valor" mais sem resultado.
produtos
é uma cópia deprodutosOriginal
? se for você vai ter de copiar uma para outra usando spread (...
). Ficaria assim a assimilação:produtos = {...produtosOriginal};
assim a alteração em "produtos" não reflete em "produtosOriginal".produtos
através daprodutosOriginal
da seguinte forma:this.produtos = this.produtosOriginal;
você não está passando os valores, está passando a referencia. Logoprodutos
aponta praprodutosOriginal
, e qualquer alteração emprodutos
irá alterarprodutosOriginal
. Espero que de pra entender...