If I have the following button in an html file
<button (click)="doSomething('testing', $event)">Do something</button>
Also, in the corresponding component, I have this function
doSomething(testString: string, event){
event.stopPropagation();
console.log(testString + ': I am doing something');
}
Is there a proper type that should be assigned to the $event
input?
The event parameter itself is an object, BUT if I assign it to a type object, I get an error
Property 'stopPropogation' does not exist on type object
So, what does Typescript consider the $event
input?
Best Answer
As suggested by @AlexJ
The event you passed through
$event
is a DOM event, therefore you can use theEventName
as the type.In your case this event is a
MouseEvent
, and the docs says, quotingIn all those cases you'll get a
MouseEvent
.Another example : if you have this code
When the event triggers you'll get a
FocusEvent
.So you can do it really simple, console log the event and you'll see a message similar to this one that'll we have the event name
You can always visit the docs for a list of existing Events.
Edit
You can also check for TypeScript
dom.generated.d.ts
with all the typings ported. In your casestopPropagation()
is part ofEvent
, extended byMouseEvent
.