从@agm/ MouseEvent导入核心在Angular 9中不起作用

Question

在我的Angular 9应用程序中，我正在使用agm google map，一切都在工作中查找，但是当我导入MouseEvent时，它显示了一个错误(src/app/place/place.component.ts:3:9 - error TS2305: Module '"../../../../../../Projects/Angular/mean2020/node_modules/@agm/core/agm-core"' has no exported member 'MouseEvent'.)，我搜索了它，但没有找到任何适当的解决方案，任何人的帮助，感谢事先

这是可能的ts文件

import { Component, OnInit, ViewChild, ElementRef, NgZone } from '@angular/core';
import { MapsAPILoader } from '@agm/core';
import { MouseEvent } from '@agm/core';

   markerDragEnd($event: MouseEvent) {
        console.log($event);
        this.latitude = $event.coords.lat;
        this.longitude = $event.coords.lng;
        this.getAddress(this.latitude, this.longitude);
    }

Answer 1

从新的3.0.0测试版开始，MouseEvent不是来自@agm/core，而是来自谷歌地图脚本。

尝试安装types包

npm install --save @types/googlemaps

并像这样使用它：

import {
  Component,
  OnInit,
  ViewChild,
  ElementRef,
  NgZone
} from '@angular/core';
import {
  MapsAPILoader
} from '@agm/core';

markerDragEnd($event: google.maps.MouseEvent) {
  console.log($event);
  this.latitude = $event.coords.lat;
  this.longitude = $event.coords.lng;
  this.getAddress(this.latitude, this.longitude);
}

您的tsconfig还应更新为包含以下内容：

"types": [
      "googlemaps"
]

这是由于来自agm的最新版本(refer to their changelog)造成的。

Answer 2

如前所述，自从新的3.0.0-beta版本以来，MouseEvent不是来自@agm/core，而是来自谷歌地图脚本。

并且您必须添加到tsconfig中

"types": [
      "googlemaps"
]

但是，此接口没有名为coord的属性，而是具有latLng属性，该属性具有lat和lng两个函数，因此不使用

this.latitude = $event.coords.lat;
this.longitude = $event.coords.lng;

你的代码应该是：

markerDragEnd($event: google.maps.MouseEvent) {
  console.log($event);
  this.latitude = $event.latLng.lat();
  this.longitude = $event.latLng.lng();
  this.getAddress(this.latitude, this.longitude);
}

我试过了，因为我有同样的问题，希望它是有用的。