Асинхронный вызов внутри вычисленной функции нокаута

Question

Прямо сейчас у меня есть вычисленная функция нокаута, которая принимает определенные переменные и делает ajax-вызов для указаний Google. Служит для получения расстояния между двумя точками. И у меня есть некоторые вычисления, выполненные для функции обратного вызова запроса ajax. То, что я хотел бы сделать, - сделать вызов ajax только тогда, когда изменяются переменные местоположения, чтобы он не делал вызовы api каждый раз, когда наблюдаемое изменение ko.

Это был мой исходный код:

ko.computed(function() { 

    if (checkStatus() !== "invalid-data") { 
     // Encode address for google API 
     var start = self.start().split(' ').join('+'); 
     var end = self.end().split(' ').join('+'); 

     var request = { 
      origin: start, 
      destination: end, 
      travelMode: google.maps.TravelMode.DRIVING 
     }; 

     directionsServices.route(request, function (response, status) { 

      if (status === "OK") { 
      // calculations 
      } else { 
      console.error("Error: " + status); 
      } 
     }); 
     } 
    } 

    }, self); 

И это была моя попытка реорганизовать вызов API:

function getTripData() { 

    var request = { 
     origin: start, 
     destination: end, 
     travelMode: google.maps.TravelMode.DRIVING 
    }; 

    return $.Deferred(function(dfd) { 
     directionsServices.route(request, dfd.resolve()); 
    }).promise(); 
} 

if (locationsChanged) { 
    trip = getTripData(); 
    trip.done (function() { 
    console.log(trip.status); 
    console.log(trip.response); 
    }); 
} 

Я знаю, что это не правильно и не работает код либо. Я не мог понять документы JQuery на отложенных и обещающих объектах. Если кто-нибудь может помочь мне понять это, это было бы здорово.

Answer 1

Насколько я могу судить, ваш рефактор не выключен.
Что вы ищете, вероятно,

function getTripData() { 
    var request = { 
     origin: start, 
     destination: start, 
     waypoints: [{ 
      location: end 
     }], 
     travelMode: google.maps.TravelMode.DRIVING 
    }; 
    var dfd = $.Deferred(); 
    directionsServices.route(request, function(response, status) { 
     dfd.resolve(response, status); 
    }); 
    return dfd.promise(); 
} 

if (locationsChanged) { 
    trip = getTripData(); 
    trip.done(function(response, status) { 
     console.log(response); 
     console.log(status); 
    }); 
}