Even though the code works fine at runtime, I encounter an error during compile time which hinders the production build process, making it necessary to ignore errors, a practice I prefer to avoid.
The issue arises when trying to cast to a marker object that seems to be interpreted as a method.
Here is a snippet of the code:
<div class="map-frame" leaflet [leafletOptions]="options"
[leafletLayers]="markers" [leafletLayersControl]="layersControl"
[(leafletCenter)]="center" (leafletMapReady)="onMapReady($event)"
(leafletCenterChange)="onCenterChange($event)"
(leafletMouseMove)="onMouseMove($event)"></div>
And here is the TypeScript implementation:
markers: Layer[] = [];
var markerObj: MarkerModel = {};
markerObj.guid = this.utils.uuidv4();
markerObj.iconUrl = pItem;
markerObj.latitude = this.lat;
markerObj.longitude = this.lng;
const newMarker = marker(
[markerObj.latitude, markerObj.longitude],
{
icon: icon( {
iconSize: [38, 38],
iconAnchor: [13, 13],
iconUrl: pItem
} ),
title: markerObj.guid
}
).on( 'click', () => {
this.zone.run(() => {
this.onMarkerClick( markerObj );
} );
} );
this.markers.push( newMarker );
However, during compilation, I face the following error:
for ( var i = this.markers.length - 1; i >= 0; i-- ) {
console.log( i, this.markers[i].title ); //compile time error
if ( this.markers[i].title == pGuid ) { //compile time error
this.markers.splice( i, 1 );
//todo update server
break;
}
}
The specific error received is: ERROR in src/app/map/map.component.ts:265:49 - error TS2339: Property 'title' does not exist on type 'Layer'.