CODEWITHSUNDEEP
htmlangulartypescript
Malathy Venkatesan
Malathy Venkatesan

Reputation: 213

How to get the previous value in (input) event in angular 4

I am trying to add the value and also need to remove the previous value by comparing with a new value.

 var  total = [];
 onSearchChange(event) {
    total.push(event);
    var sumNumber = total.reduce(
      (acc, cur) => acc + Number(cur),
      0
    );
    console.log("get all the changed value, I need to remove the previous values in the total list");
  }

 <input type='number' (input)="onSearchChange($event.target.value)" />

Upvotes: 1

Views: 12330

Answers (1)

Ashish Ranjan
Ashish Ranjan

Reputation: 12960

I don't know if the event itself retains the previous value. You can create a component property to hold the previous value and set it in every input event.

<input id="inputId" type="number" value=23 (input)="foo($event.target.value)">
// have some default value only if you want

previousValue: number

foo(value) {
    console.log("previous value ", this.previousValue);
    console.log("new value ", value);
    this.previousValue = value
}

ngAfterViewInit() {
    this.previousValue = parseInt((<HTMLInputElement>document.getElementById('inputId')).value)
}

https://stackblitz.com/edit/angular-ufd15s?file=src%2Fapp%2Fapp.component.ts

You can also add a helper event listener keydown (which seems unnecessary but just saying) on the input element. keydown will occur before input so with keydown you can grab the previous value. https://stackblitz.com/edit/angular-sjxvgp?file=src%2Fapp%2Fapp.component.ts

Upvotes: 3

Related Questions