Ошибка времени компиляции на слоях, но время выполнения нормально

Question

Код ниже прекрасно работает во время выполнения, но получает ошибку во время компиляции, которая не позволяет мне создавать производственный код, если я не игнорирую ошибки, которые я не хочу делать.

Я не могу привести к маркерному объекту, поскольку маркер представляется методом.

HTML

<div class="map-frame" leaflet [leafletOptions]="options"
    [leafletLayers]="markers" [leafletLayersControl]="layersControl"
    [(leafletCenter)]="center" (leafletMapReady)="onMapReady($event)"
    (leafletCenterChange)="onCenterChange($event)"
    (leafletMouseMove)="onMouseMove($event)"></div>

TypeScript

   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 );

            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;
                }
            }

ОШИБКА в src / app / map / map.component.ts: 265: 49 - ошибка TS2339: свойство 'title' не существует для типа 'Layer'.

Answer 1

Итак, Layer не имеет свойства title, а MarkerOptions. То, как были настроены наборы для Leaflet, похоже, они бы хотели, чтобы вы получили к нему доступ через marker.options.title. Но я не уверен, что это сработает так, как вы ожидаете.

Наборы определение (см. ссылку ниже) - это то, что определяет, что является и не является допустимым в типе компиляции, когда он выполняет проверку типа.

https://github.com/DefinitelyTyped/DefinitelyTyped/blob/master/types/leaflet/index.d.ts

У вас есть пара вариантов. Во-первых, вы можете попытаться найти способ доступа к свойству title способом, который действителен с точки зрения проверки типов. Во-вторых, вы можете просто привести к any, чтобы он компилировался без ошибок / предупреждений. Первое лучше, но второе хорошо, если вы просто хотите, чтобы оно заработало.

Вот пример приведения к any:

if ( (this.markers[i] as any).title == pGuid ) { //compile time error
      this.markers.splice( i, 1 );
      //todo update server
      break;
}