web-dev-qa-db-fra.com

Angular2 ngModelChange valeur précédente

Existe-t-il un moyen d'obtenir la valeur précédente (dernière) d'un champ sur ngModelChange? Ce que j'ai va quelque chose comme ça

HTML

<input type="text" [(ngModel)]="text" (ngModelChange)="textChanged($event)">

Gestionnaire

private textChanged(event) {
    console.log('changed', this.text, event);
}

Ce que je reçois c'est

changed *newvalue* *newvalue*

Bien sûr, je peux conserver l'ancienne valeur en utilisant une autre variable, mais y a-t-il une meilleure façon?

angularangular2-ngmodel
25
irtaza

J'ai donc trouvé une solution possible un peu bizarre (au moins pour moi) pour cela avec le moins de changements dans le code en question. Donc, en affectant l'attribut (ngModelChange) Avant [(ngModel)] ce que j'obtiens suit avec le même gestionnaire:

changed *older value* *new value*

J'obtiens la nouvelle valeur dans this.text Comme ceci:

setTimeout(() => console.log(this.text), 0);
21
irtaza

Ce que vous pouvez faire, c'est

DÉMO: http://plnkr.co/edit/RXJ4D0YJrgebzYcEiaSR?p=preview

<input type="text" 
       [ngModel]="text"                      //<<<###changed [(ngModel)]="text" to [ngModel]="text"
       (ngModelChange)="textChanged($event)"> 

private textChanged(event) {        
    console.log('changed', this.text, event);
    this.text=event;                          //<<<###added 
}
33
micronyks

tout ce que vous devez faire est de mettre (ngModelChange) = "textChanged ($ event)" à gauche de l'élément [(ngModel)] dans la balise html, comme:

<input (whatever...) (ngModelChange)="textChanged($event)" [(ngModel)]="text">

De cette façon, à l'intérieur de textChanged (événement), l'élément auquel vous liez a toujours la valeur précédente, tandis que l'événement est le nouveau

7
DiSaSteR
<input (ngModelChange)="preTextChanged($event)" [(ngModel)]="text" (ngModelChange)="postTestChanged($event)">

De cette façon, vous pouvez connaître la valeur précédente et la valeur suivante

0
user3757628