Javascript Bing地图地理代码回调不';我没接到电话
总体情况: 我想将地理编码添加到我的应用程序中。我能够在直接的JavaScript中运行它,但是在转换为Angular/TypeScript之后,回调不会被触发 示例:如果用户输入1 Microsoft Way,Redmond,WA。应返回经度和纬度:纬度:47.64006815850735,经度:-122.12985791265965 代码示例基于以下资源构建:Javascript Bing地图地理代码回调不';我没接到电话,javascript,angularjs,typescript,bing-maps,Javascript,Angularjs,Typescript,Bing Maps,总体情况: 我想将地理编码添加到我的应用程序中。我能够在直接的JavaScript中运行它,但是在转换为Angular/TypeScript之后,回调不会被触发 示例:如果用户输入1 Microsoft Way,Redmond,WA。应返回经度和纬度:纬度:47.64006815850735,经度:-122.12985791265965 代码示例基于以下资源构建: 错误详细信息: 这些错误具体发生在变量名中:geocodeRequestsearchModuleLoaded()已加载,但我
geocodeRequest
searchModuleLoaded()
已加载,但我的geocodeRequest
从不触发geocodeCallback
或errCallback
。我认为这与我的方法的范围有关,但似乎无法找出导致错误的原因。关于如何触发我的回调有什么想法吗
角度/字体脚本(不工作)
工作版本(工作,但没有角度/字体脚本)
经过深入调查,我终于解决了我的问题 出了什么问题? 问题发生在
搜索模块加载的中。两个回调都未定义
。一个问题是,它试图在模块加载之前执行searchModuleLoaded
,另一个问题是因为它不知道该的上下文
要解决这个问题,我必须在加载Microsoft.Maps.Search
时修改回调。模块的回调现在转换为lambda函数,该函数调用this.searchModuleLoaded()
。一旦将其编译成JavaScript,它将适当地设置this
上下文,即\u this=this
。我的代码现在看起来像这样:
getMap() {
this.map = new Microsoft.Maps.Map(document.getElementById('myMap'), {credentials: "put your key here"});
Microsoft.Maps.loadModule('Microsoft.Maps.Search', {
callback: () => {
this.searchModuleLoaded();
}
});
};
searchModuleLoaded() {
var searchManager = new Microsoft.Maps.Search.SearchManager(this.map);
var geocodeRequest = {
where: "1 Microsoft Way, Redmond, WA",
count: 10,
callback: this.geocodeCallback,
errorCallback: this.errCallback
};
searchManager.geocode(geocodeRequest);
};
geocodeCallback(geocodeResult, userData) {
alert("The first geocode result is " + geocodeResult.results[0].location + ".");
};
errCallback(geocodeRequest) {
alert("An error occurred.");
};
function GetMap(){
map = new Microsoft.Maps.Map(document.getElementById("mapDiv"), {credentials: "key goes here", center: new Microsoft.Maps.Location(47.5, -122.3), zoom: 9 });
Microsoft.Maps.loadModule('Microsoft.Maps.Search', { callback: searchModuleLoaded });
}
function searchModuleLoaded(){
var searchManager = new Microsoft.Maps.Search.SearchManager(map);
var geocodeRequest = {where:"1 Microsoft Way, Redmond, WA", count:10, callback:geocodeCallback, errorCallback:errCallback};
searchManager.geocode(geocodeRequest);
debugger;
}
function geocodeCallback(geocodeResult, userData){
alert("The first geocode result is " + geocodeResult.results[0].location + ".");
}
function errCallback(geocodeRequest){
alert("An error occurred.");
}
getMap() {
this.map = new Microsoft.Maps.Map(document.getElementById('myMap'), {credentials: "put your key here"});
Microsoft.Maps.loadModule('Microsoft.Maps.Search', {
callback: () => {
this.searchModuleLoaded();
}
});
};
searchModuleLoaded() {
var searchManager = new Microsoft.Maps.Search.SearchManager(this.map);
var geocodeRequest = {
where: "1 Microsoft Way, Redmond, WA",
count: 10,
callback: this.geocodeCallback,
errorCallback: this.errCallback
};
searchManager.geocode(geocodeRequest);
};
geocodeCallback(geocodeResult, userData) {
alert("The first geocode result is " + geocodeResult.results[0].location + ".");
};
errCallback(geocodeRequest) {
alert("An error occurred.");
};