来自谷歌地理位置(离子)的数组长度



有人可以指出正确的语法方向,用于返回来自 Google 地点搜索的结果值。就像我的搜索返回 5 个位置一样,我想从我的数组中提取值 5,并在我的应用程序中显示该信息"已找到 5 个位置!我已经设法得到了附近的地方列表。但我不确定如何获得值。

现在我使用此代码访问Google位置搜索结果数组

goToDirectionPage(index){
      console.log(this.places);
      console.log("index" + index);
      let selectedPlace = this.places[index].geometry.location;
      console.log(selectedPlace);
      this.navCtrl.push(DirectionPage, {
        origin: this.currentLocation,
        destination: selectedPlace
      });
    }

这是谷歌地点搜索的代码

import { Component} from '@angular/core';
import { NavController, NavParams } from 'ionic-angular';
/**
 * Generated class for the DirectionPage page.
 *
 * See https://ionicframework.com/docs/components/#navigation for more info on
 * Ionic pages and navigation.
 */
declare var google;
@Component({
  selector: 'page-direction',
  templateUrl: 'direction.html',
})
export class DirectionPage {
  origin: any;
  destination: any;
  map: any;

  constructor(public navCtrl: NavController, public navParams: NavParams) {
    this.origin = navParams.get('origin');
    this.destination = navParams.get('destination');
    this.map = navParams.get('map');
  }
  ionViewDidLoad() {
    this.calculateRoute();
    console.log('ionViewDidLoad DirectionPage');
  }
  calculateRoute(){
    let mapOptions = {
      center: this.origin,
      zoom: 10,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    }
    this.map = new google.maps.Map(document.getElementById("directionMap"), mapOptions);
    let directionsService = new google.maps.DirectionsService();
    let directionsDisplay = new google.maps.DirectionsRenderer();
    directionsDisplay.setMap(this.map);
    let request = {
      origin: this.origin,
      destination: this.destination,
      travelMode: google.maps.TravelMode.DRIVING
    };
    directionsService.route(request, function(response, status){
      if(status == google.maps.DirectionsStatus.OK){
        directionsDisplay.setDirections(response);
        directionsDisplay.setPanel(document.getElementById('directionPanel'));
      }else{
        console.warn(status);
      }
    });
  }

}

期望的结果

在某些地方.html

    <ion-card>
       <ion-item ng-if = "places" >
       Places Found: {{places?.length}}
      </ion-item>
     </ion-card>  
    <ion-card id="result"> </ion-card>
      <button ion-item *ngFor = "let place of places; let i = index" (click)="goToDirectionPage(i)">
       {{place.name}} + <br/> {{place.vicinity}} <br /> Average Rating: {{place.rating}}
      </button>
    </ion-list>

相关内容

  • 没有找到相关文章

最新更新