So the following code is in Angular 4 and I can't figure out why it doesn't work the way as expected.
Here is a snippet of my handler:
onUpdatingServerName(event: Event) {
console.log(event);
this.newserverName = event.target.value; //this wont work
}
HTML element:
<input type="text" class="form-control" (input)="onUpdatingServerName($event)">
The code gives me the error:
Property 'value' does not exist on type 'EventTarget'.
But as it can be seen in the console.log
that value does exist on the event.target
.
Best Answer
event.target
here is anHTMLElement
which is the parent of all HTML elements, but isn't guaranteed to have the propertyvalue
. TypeScript detects this and throws the error. Castevent.target
to the appropriate HTML element to ensure it isHTMLInputElement
which does have avalue
property:Per the documentation:
(Emphasis mine)