我正在使用谷歌地方详细信息api。所以在我的src属性中我把google api放在一个名为initMap的回调中 这是代码
<div class="tab-pane active" id="timeline">
<p class="lead">Location</p>
<hr>
<div class="row">
<div class="col-md-1"></div>
<div class="col-md-8">
<h2><a href="#"></a>
<span>location <b style="color:black;"> kolkata</b></span></h2>
<p></p>
<div id="map" style="width:100%;height:400px;"></div>
<script src="https://maps.googleapis.com/maps/api/js?key=API_KEY&libraries=places&callback=initMap"></script>
<p></p>
</div>
</div>
</div>
在同一个html中我编写了initMap函数
<script>
function initMap() {
var map = new google.maps.Map(document.getElementById('map'), {
center: {lat: 22.652687, lng: 88.376882},
zoom: 15
});
var infowindow = new google.maps.InfoWindow();
var service = new google.maps.places.PlacesService(map);
service.getDetails({
placeId: 'ChIJvYbRT7Gd-DkR6QZQfJP9ZJg'
}, function(place, status) {
debugger
if (status === google.maps.places.PlacesServiceStatus.OK) {
var marker = new google.maps.Marker({
map: map,
position: place.geometry.location
});
google.maps.event.addListener(marker, 'click', function() {
infowindow.setContent('<div><strong>' + place.name + '</strong><br>' +
'Place ID: ' + place.place_id + '<br>' +
place.formatted_address + '</div>');
infowindow.open(map, this);
});
}
});
}
</script>
只要此函数存在于脚本标记内,这就完美无缺。 如何在控制器内调用initMap?
答案 0 :(得分:1)
您无法以这种方式调用它,但是当您使用document.createElement('script')
加载应用时,您将在控制器内使用javascript加载脚本,然后挂钩onload
事件侦听器,然后附加它在head
头标记内。
最有可能:
var script = document.createElement('script');
script.src = 'google api script';
script.onload = function () {
// your onload function
$scope.onload();
$scope.$digest();
};
document.querySelector('head').appendChild(script);
通过这种方式,您可以控制每次加载时想要执行的操作。希望有所帮助
答案 1 :(得分:0)
当您在HTML页面内创建一个函数时,该函数将自动分配给window
对象,因为它是页面中包含的脚本的默认范围。
因此,从您的控制器,您应该只需使用:window.initMap();