Expose source HTML element for click events

[zolee]

Is your feature request related to a problem? Please describe

We have built a time reporting component based on your angular calendar package. Our component uses a popover to make possible the time riporting (can be seen on the attached picture below) and the popover itself based on Angular CDK overlay. The popover component uses flexibleConnectedTo() PositionStrategy and for the proper alignment of the popup we need to provide the originating element (ElementRef | HTMLElement | Point) the popover should be snapped to.

For this to work we use a hacky solution... setting ids to the hour segments and events based on their timestamp or event id and when one of them clicked we try to parse the time / get the id of the originating event and guess the element. As you can see this one is not the best solution.

Describe the solution you'd like

Currently there are multiple usable events (like dayClicked, eventClicked, eventTimesChanged etc.) which exposes a lot of information but not the originating HTML element itself the action is used on.

So it would be really grate if we could pass the actual element as a parameter.

Describe your use case for implementing this feature

The use case would be the above mentioned improvement, where we could greatly reduce the complexity of the originating element parsing and improve code readability.

Additional context

[matts-bot]

Thanks so much for opening an issue! If you'd like me to give priority to answering your issue or would just like to support this project, then please consider supporting me on Patreon

[mattlewis92]

This sounds like a reasonable request, I think for maximum flexibility we can just expose a mouseEvent property on every *Clicked output with the original click event, and then you can use $event.mouseEvent.target to get the html element that was clicked. Do you want to send a PR?

[mattlewis92]

I just added this in the latest 0.28 beta, you can try it today with:

npm i angular-calendar@next

Then in any click handlers you can do $event.sourceEvent.target to get the html element that was clicked 🎉

[zolee]

Great. Thank you very much for your effort. I will check this ASAP, will be very useful.