如何修复角度的openLayers拖放类型错误

如何解决如何修复角度的openLayers拖放类型错误

我想使用openLayers的Drag-and-Drop在我的角度项目中的地图上显示GPX文件。

但是在

之内

  dragAndDropInteraction = new DragAndDrop({
    formatConstructors: [GPX,GeoJSON,IGC,KML,TopoJSON],})

我遇到以下错误：
Type 'typeof GPX' is missing the following properties from type 'FeatureFormat': dataProjection,defaultFeatureProjection,adaptOptions,getReadOptions,and 8 more.

我已经搜索了几个小时，但是找不到任何有用的...我找到了一个解决方案，虽然有，但这有点“肮脏的修正”

解决方法

解决方案是在数组中声明<any>类型 所以，这是我的代码

 dragAndDropInteraction = new DragAndDrop({
    formatConstructors: [<any>GPX,GeoJSON,IGC,KML,TopoJSON],})

我理解在这里键入的问题，因为这是构造函数的数组，但抱歉，无法进一步解释

---

对于那些希望查看完整代码的人

import { Feature } from 'ol'
import { Coordinate } from 'ol/coordinate'
import { GeoJSON,GPX,TopoJSON } from 'ol/format'
import Geometry from 'ol/geom/Geometry'
import { defaults as defaultInteractions,DragAndDrop } from 'ol/interaction'
import { DragAndDropEvent } from 'ol/interaction/DragAndDrop'
import TileLayer from 'ol/layer/Tile'
import VectorLayer from 'ol/layer/Vector'
import Map from 'ol/Map'
import 'ol/ol.css'
import * as olProj from 'ol/proj'
import OSM from 'ol/source/OSM'
import VectorSource from 'ol/source/Vector'
import View from 'ol/View'

@Component({
  selector: 'example-component',templateUrl: 'example-component.html',})
export class ExampleComponent implements AfterViewInit {
  map: Map
  view: View

  dragAndDropInteraction = new DragAndDrop({
    formatConstructors: [<any>GPX,})

 constructor(){}

 // I declared it in the `ngAfterViewInit`,but `ngOnInit` is also fine
 ngAfterViewInit() {
    this.view = new View({
      center: [0,0],zoom: 15,})

    this.map = new Map({
      interactions: defaultInteractions().extend([this.dragAndDropInteraction]),target: 'example_map',layers: [
        new TileLayer({
          source: new OSM(),}),],view: this.view,})

    this.dragAndDropInteraction.on('addfeatures',(event: DragAndDropEvent) => {
      console.log(event)
      let vectorSource = new VectorSource({
        features: <Feature<Geometry>[]>event.features,})

      this.map.addLayer(
        new VectorLayer({
          source: vectorSource,)

      this.map.getView().fit(vectorSource.getExtent())
    })
  }
}

  <div id="example_map"></div>