在angular4中引入高德地图

申请高德APIkey -> 

在index.html中加入

<script src="//webapi.amap.com/maps?v=1.3&key=你申请的key"></script>

　　

因为typescript不认识AMap对象，编译会报错，所以将下面代码加入src目录下的typings.d.ts文件中

declare var AMap;

在组件模板中添加id="container"的标签

我是在AfterContentInit生命周期中来调用map

ngAfterContentInit() {
    this.map = new AMap.Map('container', {
      resizeEnable: true,
      mapStyle: 'amap://styles/fresh',
      center: [104.065840, 31.551877],
      zoom: 18
    });
  }

高德地图添加成功！