如何在Angular 4中实现Google Maps API(initMap)？

发布时间：2020-12-17 07:16:12 所属栏目：安全来源：网络整理

导读：我尝试在Angular中集成Google地图. 的index.html script async defer src="https://maps.googleapis.com/maps/api/js?key=api_keycallback=initMap"/script example.component.html ...div id="map"/div... example.component.ts ...ngAfterViewInit() { fun

我尝试在Angular中集成Google地图.

的index.html

<script async defer src="https://maps.googleapis.com/maps/api/js?key=api_key&callback=initMap"></script>

example.component.html

...
<div id="map"></div>
...

example.component.ts

...
ngAfterViewInit() {
        function initMap() {
            var uluru = {lat: -25.363,lng: 131.044};
            var map = new google.maps.Map(document.getElementById('map'),{
                zoom: 4,center: uluru
            });
            var marker = new google.maps.Marker({
                position: uluru,map: map
            });
        }
    }

我仍然得到错误“initMap不是一个函数”.

解决方法

当Google的脚本试图调用它时,initMap函数不可用,因此它会中断.它也不是全球可用的,因为谷歌的脚本预计(它的范围是该类).

有一个名为Angular Google Maps的现有库,其目的是使用带有Angular应用程序的Google Maps.

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!