Angular2 引用高德地图

（1）在全局中引用高德地图api（楼主在index.html 里引用）

<script src="http://webapi.amap.com/maps?v=1.4.6&key=你的高德key值"></script>

（2）在各个组件中引用高德地图

component.ts 文件

  public ngOnInit() {
    const mapObj = new AMap.Map('mapviewcontainer', {
      resizeEnale: true,
      zoom: 15,
      center: [113.592618, 22.942735]
    });
}

.html 文件

  <div class="page-wrapper">
    <div style="width: 100%; height: 100%;padding-top: 44px;">
      <div id="mapviewcontainer" style="width: 1730px; height: 900px;"></div>
    </div>
  </div>

这就可以简单地引用高德地图了

当引用高德地图的插件时，Angular会报不是其构造函数，此时需在引用api时加上对应的插件即可，例如引用高德的逆向解析地址： AMap.Geocoder

<script src="http://webapi.amap.com/maps?v=1.4.6&key=你的高德key值&plugin=AMap.Geocoder"></script>

let geocoder = new AMap.Geocoder();
          geocoder.getAddress(lnglatXY, (status, result) => {
            if (status === 'complete' && result.info === 'OK') {
              this.addressname = result.regeocode.formattedAddress;
            }
          });