javascript - 有没有办法等到 DirectionsService 返回结果？

Question

我对 Google DirectionsService 有疑问。我知道它是异步的，这就是我遇到麻烦的原因。我想等到 DirectionsService 返回结果，而不是在没有答案的情况下执行代码。这是一个示例：

function snap_to_road (lat) {
    var position;

    var request = {
        origin: lat,
        destination: lat,
        travelMode: google.maps.DirectionsTravelMode.DRIVING
    };

    directionsService.route(request, function(response, status) {
        if (status == google.maps.DirectionsStatus.OK) {
            return response.routes[0].legs[0].start_location;
        }
    });
}

alert(snap_to_road(current.latLng));

总是显示： “alert未定义”。有没有办法解决这个问题？

Answer 1

我不认为这是可能的。您可以在 snap_to_road 中使用回调参数：

function snap_to_road (lat, callback) {
    var position;

    var request = {
        origin: lat,
        destination: lat,
        travelMode: google.maps.DirectionsTravelMode.DRIVING
    };

    directionsService.route(request, function(response, status) {
        if (status == google.maps.DirectionsStatus.OK) {
            callback(response.routes[0].legs[0].start_location);
        }
    });
}

snap_to_road(current.latLng, function(result) {
    alert(result);
});

Answer 2

您可以让 snap_to_road() 返回一个 Promise，然后在异步函数中使用 await。await 运算符用于等待 Promise。它只能在常规 JavaScript 代码中的异步函数内部使用。像这样：

 function snap_to_road (lat) {
var position;

var request = {
    origin: lat,
    destination: lat,
    travelMode: google.maps.DirectionsTravelMode.DRIVING
};
return new Promise((resolve, reject) => {
    directionsService.route(request, function(response, status) {
        if (status == google.maps.DirectionsStatus.OK) {
            resolve(response.routes[0].legs[0].start_location);
        }else{
            reject(0);
        }
    });
});

}

async function alertPromise(){
    await snap_to_road(current.latLng).then((resolve) => {
        alert(resolve)
    })
}

您可以在 reject() 中放入一些消息并在之前进行处理。

Answer 3

谷歌路线返回结果后调用您的警报方法。喜欢：在按钮单击事件后调用 snap_to_road。

function snap_to_road (lat) {
  var position;

  var request = {
    origin: lat,
    destination: lat,
    travelMode: google.maps.DirectionsTravelMode.DRIVING
  };

  directionsService.route(request, function(response, status) {
    if (status == google.maps.DirectionsStatus.OK) {
      ShowAlert(response.routes[0].legs[0].start_location);
    }
  });
}

function ShowAlert(result){
  alert(result);
}

Answer 4

这是我上面提到的一个例子：

var path = "/path/to/some/resource";

$.ajax({
        url:    path,
        type: "get",
        data: serializedData,  //<-- depends on what data you are using
        async: false, //will wait until resource has loaded or failed 

         //will be called on success
        success: function(response, textStatus, jqXHR){
            // log a message to the console
            console.log("Successfully loaded resource!");
        },
         //will be called on error
        error: function(jqXHR, textStatus, errorThrown){
            // log the error to the console
            console.log(
                "The following error occured: "+
                textStatus, errorThrown
            );
        },
        // callback handler that will be called on completion
        // which means, either on success or error
        complete: function(){
            console.log("Completed: with error or success");
        }
    });