Ionic 3 / Google Distance Matrix API - PullRequest
Новая
       10

Ionic 3 / Google Distance Matrix API

0 голосов
/ 27 апреля 2018

Основная идея, которую я пытаюсь реализовать: У меня есть список ветвей, каждая из которых имеет атрибуты lat, lng, которые содержат широту и долготу. Я хочу использовать Google Distance Matrix API для определения расстояния и продолжительности до каждого из них.

Это мой код ..

Branches.ts (страница, которая показывает все ветви, где я также хочу показать расстояние и продолжительность) 

//other imports
import { TravelDetailsProvider } from '../../providers/travel-details/travel-details';

@IonicPage()
@Component({
   selector: 'page-branches',
   templateUrl: 'branches.html',
})
export class BranchesPage {

  constructor(
    public navCtrl: NavController,
    public navParams: NavParams,
    public branchProvider: BranchProvider,
    public travelProvider: TravelDetailsProvider
  ){
  }

  ionViewDidLoad() {
    this.getBranches();
  }

  getBranchDistanceAndTime(){
      for(let branch of this.allBranches){
        this.travelProvider.getTravelDetails(branch);
      }
  }

}

Я знаю, что мне, вероятно, следует присваивать значение, которое возвращается переменной в моем branch.ts, и повторять их в представлении, но по какой-то причине я не могу получить значение, возвращаемое из метода getTravelDetails()

Путешествия-details.ts 

declare var google;
var service = new google.maps.DistanceMatrixService();
@Injectable()
export class TravelDetailsProvider {

  private travelDetailsObject: any = {};

  constructor(public http: HttpClient) {
  }

  getTravelDetails(branch){
    service.getDistanceMatrix(
       {
          origins: [new google.maps.LatLng(6.870128,79.880340)],
          destinations: [new google.maps.LatLng(branch.lat, branch.lng)],
          travelMode: 'DRIVING'
       }, this.callback);
  }

  callback(response, status) {
     let travelDetailsObject;
     if (status == 'OK') {
       var origins = response.originAddresses;
       var destinations = response.destinationAddresses;
       for (var i = 0; i < origins.length; i++) {
         var results = response.rows[i].elements;
         for (var j = 0; j < results.length; j++) {
            var element = results[j];
            var distance = element.distance.text;
            var duration = element.duration.text;
            var from = origins[i];
            var to = destinations[j];
            travelDetailsObject = {
               distance: distance,
               duration: duration
            }
         }
       }
       this.travelDetailsObject = travelDetailsObject;
   }
 }

}

Когда я запускаю этот код, я получаю сообщение об ошибке: Uncaught TypeError: Cannot set property 'travelDetailsObject' of null

После некоторого исследования я наткнулся на эту страницу вопросов github. Мне интересно, если это проблема у меня https://github.com/rollbar/rollbar.js/issues/344

Спасибо за любую помощь

...