在所有回调完成后,我如何处理多个Google Places API结果



我有一个array,它包含来自Google Geocode和Places JavaScript API的定位结果。

Place结果中该数组中的任何元素都包含place_id值,我想利用它来获取有关该位置的进一步基本信息。

初始数组(uniqueGeoRes(可以包含多达7个结果。

我搞不清Places API服务和回调,以及在检查了uniqueGeoRes的所有元素以获取额外的Places数据后如何实现回调。

例如,如果uniqueGeoRes的所有7个元素都有一个place_id,我需要使用Places服务来获得每个元素的附加信息。

执行此操作的循环在Places回调完成之前完成,因为外部函数不是异步的。

我认为一个承诺可能会有所帮助,但我仅限于ES3。这是我迄今为止所拥有的。这并没有给出预期的结果,因为当回调完成时,i的值已经满足q的值,即使在第一次回调时也是如此。

我完全迷失了方向!

在对新填充的addrOutput数组执行任何操作之前,如何确保Places回调完成?

var q;
q = 7;

// Set the size of the results array (q is hardcoded maximum value)
if (uniqueGeoRes.length < q) {
q = uniqueGeoRes.length;
}
uniqueGeoRes.length = q;
var addrOutput = [];
//Check for additional Places data
function updatePlace(arr, callback1){

console.log('asyncFunction has been called');
console.log('processing: ', arr);

for (var i = 0; i < q; i++) { // each element in the uniqueGeoRes array

if (arr[i].source = 'Places API') {   
// Append extra information from the Place look up on individual place_id
console.log('Getting additional information for PLACES result: ' + arr[i].place_id);

var request = { placeId: uniqueGeoRes[i].place_id, fields: ['address_component', 'formatted_address', 'geometry', 'name'] };
service.getDetails(request, callback);

function callback(place, status) {  // Get the additional place information.

if (status == google.maps.places.PlacesServiceStatus.OK) {


addrOutput.push(place);
console.log ('Loop is ' + i + '/' + q + '. addrOutput length is now: ' + addrOutput.length);

if (i === q) {
callback1()
}

} else {
console.warn ('Place Service Status is bad.');
} 

}

} 
}

};  
// Call when asyncFunction completes
function callback1(error) {
if (!error) console.log('asyncFunction is complete');
}

updatePlace(uniqueGeoRes, callback1);

这是当前输出

[Log] asyncFunction has been called (development, line 817)
[Log] processing:  – [Object, Object, Object, …] (7) (development, line 818)
[Object, Object, Object, Object, Object, Object, Object]Array (7)
[Log] Getting additional information for PLACES result: ChIJwSc0D-zih0gR2uOIFj2UCv8 (development, line 824)
[Log] Getting additional information for PLACES result: ChIJr_4dcTH9h0gRl1OqMr4OSec (development, line 824)
[Log] Getting additional information for PLACES result: ChIJ9wqvVQ7jh0gRPYUz575U0Bs (development, line 824)
[Log] Getting additional information for PLACES result: ChIJBw3rDLXih0gRivw-FONRgZU (development, line 824)
[Log] Getting additional information for PLACES result: ChIJ774cdbXih0gRwWCg-MxTKjs (development, line 824)
[Log] Getting additional information for PLACES result: ChIJwQnvs5Pih0gR125FEtKwli0 (development, line 824)
[Log] Getting additional information for PLACES result: ChIJXyhtsZPih0gRIZgUPLvv_Ws (development, line 824)
[Log] Loop is 7/7. addrOutput length is now: 1 (development, line 835)
[Log] asyncFunction is complete (development, line 854)
[Log] Loop is 7/7. addrOutput length is now: 2 (development, line 835)
[Log] asyncFunction is complete (development, line 854)
[Log] Loop is 7/7. addrOutput length is now: 3 (development, line 835)
[Log] asyncFunction is complete (development, line 854)
[Log] Loop is 7/7. addrOutput length is now: 4 (development, line 835)
[Log] asyncFunction is complete (development, line 854)
[Log] Loop is 7/7. addrOutput length is now: 5 (development, line 835)
[Log] asyncFunction is complete (development, line 854)
[Log] Loop is 7/7. addrOutput length is now: 6 (development, line 835)
[Log] asyncFunction is complete (development, line 854)
[Log] Loop is 7/7. addrOutput length is now: 7 (development, line 835)
[Log] asyncFunction is complete (development, line 854)

forkJoin可以在这种情况下提供帮助。使用forkJoin,我们可以在所有可观察性都完成时收集可观察器和回调函数。以下链接可能有助于样品

https://rxjs-dev.firebaseapp.com/api/index/function/forkJoinhttps://stackblitz.com/edit/typescript-c3f62b?file=index.ts&devtoolsheight=100

使用Promise.all 可以实现类似的功能

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise/all

最新更新