如何为Leaflet插件实现新的TS TypeDefinition

时间:2018-07-27 15:11:14

标签: typescript leaflet

我尝试为Leaflet插件创建一个新的Typescript定义:leaflet-layer-overpass。 不幸的是,我总是收到错误消息:

ERROR in src/app/shared/map/map.component.ts(158,21): error TS2694: 
Namespace 
'"/datadisk/src/project/node_modules/@types/type-leaflet-layer-overpass/index"' has no exported member 
'OverPassLayer'.

这是我所做的: 1.使用@ types / type-leaflet-layer-overpass中的npm构建所有需要安装的新node_module 2.创建了以下index.d.ts文件

import * as L from 'leaflet';

declare module 'leaflet' {

        interface OverPassLayer {
          options: OverPassLayerOptions;
          initialize(options: OverPassLayerOptions): void;
          _getPoiPopupHTML(tags: string[], id:string|number): HTMLElement;
          _buildRequestBox(bounds: LatLngBounds): Rectangle;
            _addRequestBox(box: Layer): Layer;
            _getRequestBoxes(): void;
            _removeRequestBoxes(): LayerGroup;
            _addResponseBox(box: Layer): LayerGroup;
            _addResponseBoxes(requestBoxes: Layer[]): void;
            _isFullyLoadedBounds(bounds: LatLngBounds, loadedBounds: LatLngBounds): boolean;
            _getLoadedBounds(): LatLngBounds;
            _addLoadedBounds(bounds: LatLngBounds): void;
            /**
             * @todo set return type
             */
            _buildClipsFromBounds(bounds: LatLngBounds): any;
                /**
             * @todo set types
             */
            _buildBoundsFromClips(clis: any): any;
            _buildOverpassQueryFromQueryAndBounds(query: string,bounds: LatLngBounds): string;
            _buildOverpassUrlFromEndPointAndQuery(endPoint: string, query: string): string;
            _buildLargerBounds(bounds: LatLngBounds): LatLngBounds;
                /**
             * @todo set types
             */
            _setRequestInProgress(isInProgress: any): void;
            _isRequestInProgress(): any;
            _hasNextRequest(): boolean;
                /**
             * @todo set types
             */
            _getNextRequest(): any;
            _setNextRequest(nextRequest: any): void;
            _removeNextRequest(): void;
                    /**
             * @todo set types
             */
            _prepareRequest(): any;
                    /**
             * @todo set types
             */
            _sendRequest(bounds: LatLngBounds): any;
            _onRequestLoad(xhr: any, bounds: LatLngBounds): void;
            _onRequestTimeout(xhr: any, url: string, bounds: LatLngBounds): void;
            _onRequestLoadCallback(bounds: LatLngBounds): void;
            _onRequestCompleteCallback(): void;
            onAdd(map: Map): void;
            onRemove(map: Map): void;
            setQuery(query: string): void;
            _resetData(): void;
            getData(): any;
        }

        class OverPassLayer {
            constructor(options?: OverPassLayerOptions);
        }

        interface OverPassLayerOptions {
            debug?: boolean;
            minZoom?: number;
            endpoint?: string;
            query: string;
            loadedBounds?: LatLngBounds; // could be also LatLngBoundsLiteral
            markerIcon?: string|null;
            timeout?: number;
            retryOnTimeout?: boolean;
            noInitialRequest?: boolean;
          beforeRequest?(): void;
          afterRequest?(): void;
          /**
           * @todo define data
           */
          onSuccess?(data: any): void;
          onError?(): void;
          onTimeout?(): void;
          minZoomIndicatorEnabled?: boolean;
          minZoomIndicatorOptions?: { minZoomMessageNoLayer: string, minZoomMessage: string };
        }

}

这些定义还不是最终的或完整的。现在,我需要的是Typescript将这个定义用于Leaflet模块。

在最终应用中,用于Leaflet的OverPassLayer插件将按以下方式使用:

import { Injectable } from '@angular/core';
import * as Leaf from 'leaflet';

@Injectable({ providedIn: 'root' })
export class OverpassService {

  constructor() {
  }

 queryRailwaySignal() {
   return new Leaf.OverPassLayer({
     query: `an example query`
   });
 }
}

我做错了什么?我该怎么办才能消除错误“没有导出的成员'OverPassLayout'”?

0 个答案:

没有答案