Angular 10 - Openlayers get map coordinates on (click)

Question

I have an OpenLayers map in my Angular map component. I need to get the click coordinate of the map on the Angular (click) event. In Javascript is easy, just adding the following code:

map.on('click', function(evt) {
  var coordinate = evt.coordinate;
}

In Angular on the map.component.html, I added the following code:

<div id="map" (click)="getCoord($event)" class="map"></div>

And created the getCoord() function in my map.component.ts just like this:

getCoord(event: any){
    var coordinate = this.map.getEventPixel(event);
 }

For the same click event, javascript returns this coordinate, which is the one I need

Array [ -180047.42012573266, 5279667.9723422285 ]

But in angular, I get this one:

Array [ 480, 221 ]

Any idea of how can I get the correct coordinate using Angular, or how can I convert the second into the first one? I'm really stuck in this.

Thanks!

Answer 1

Finally solved with getEventCoordinate():

 getCoord(event: any){
    var coordinate = this.map.getEventCoordinate(event);
 }

for the click event generated in the map.component.html:

<div id="map" (click)="getCoord($event)" class="map"></div>