Updated Version
There is an updated version of this article here:
Scenario
We have an input
field and we want to log the contents of it whenever a keyup
event occurs.
Approach
First define the components keyup event handler:
keyup(event) {
console.log(event);
console.log(this.fieldvalue);
}
Note that we are logging the value both from the event
that the handler receives and the fieldvalue
that we bind in the component declaration.
Next declare the input
field in the component template (Note that the event must start with $ as in $event
):
<input placeholder="Type stuff ..." [value]="fieldvalue" (keyup)="keyup($event.target.value)">