推荐网址
高德地图api: /
高德地图api使用手册：/api/javascript-api/guide/abc/quickstart
高德在线测试地址： /demo/javascript-api/example/map-lifecycle/map-show
注意：非angularjs
1、准备工作
首先，注册开发者账号，成为高德开放平台开发者
登陆之后，在进入「应用管理」 页面「创建新应用」
为应用添加 Key，「服务平台」一项请选择「 Web 端 ( JSAPI ) 」
创建应用后的界面：
方框里的key值就是要在index.html里引入的值
2、在angular的index.html里引入key值
加入这句话
<script src="/maps?v=1.4.15&key=应用的key值"></script>
或者：
<script type="text/javascript" src="/maps?v=2.0Beta&key=应用的key值"></script>
只是高德地图的版本不同而已
3、在angular里引入高德地图
1、准备容器
<div id='map' style='width:800px; height:600px;'></div>
2、js渲染
ngAfterViewInit(): void {setTimeout(() => {const map: any = new AMap.Map('map', {resizeEnable: true,zoom: 11, // 级别center: [116.397428, 39.90923] // 中心点坐标});}, 100);}// 这里使用了定时器，为了保证html渲染完再进行地图渲染，也可以使用@viewChild来获取节点
结果：
