我正在使用Angular 6通过Google Maps Direction API实现基于Google Maps的应用程序。我在项目中使用了以下初始代码。但是当ng服务时,它会显示 Cannot find name 'calculateAndDisplayRoute'
。
我已经尝试过在类上方声明函数名称'calculateAndDisplayRoute',但似乎也不起作用。
这是什么问题?
import { Component, OnInit } from '@angular/core';
declare var google: any;
@Component({
selector: 'app-home',
templateUrl: './home.component.html',
styleUrls: ['../../resources/css/style.min.css', '../../resources/css/bt.min.css']
})
// declare var calculateAndDisplayRoute(directionsService, directionsDisplay) : any;
export class HomeComponent implements OnInit {
initMap() {
var directionsService = new google.maps.DirectionsService;
var directionsDisplay = new google.maps.DirectionsRenderer;
var map = new google.maps.Map(document.getElementById('map'), {
zoom: 7,
center: {lat: 41.85, lng: -87.65}
});
directionsDisplay.setMap(map);
var onChangeHandler = function() {
calculateAndDisplayRoute(directionsService, directionsDisplay);
};
document.getElementById('start').addEventListener('change', onChangeHandler);
document.getElementById('end').addEventListener('change', onChangeHandler);
}
calculateAndDisplayRoute(directionsService, directionsDisplay) {
directionsService.route({
origin: (<HTMLInputElement>document.getElementById('start')).value,
destination: (<HTMLInputElement>document.getElementById('end')).value,
travelMode: 'DRIVING'
}, function(response, status) {
if (status === 'OK') {
directionsDisplay.setDirections(response);
}
else {
window.alert('Directions request failed due to ' + status);
}
});
}
constructor() {
}
ngOnInit() {
this.initMap();
}
}
答案 0 :(得分:1)
您应该在打字稿中使用箭头功能
var onChangeHandler = () => {
calculateAndDisplayRoute(directionsService, directionsDisplay);
};