Warning: file_get_contents(/data/phpspider/zhask/data//catemap/2/ionic-framework/2.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Google maps 来自Google地理定位的数组长度(Ionic)_Google Maps_Ionic Framework_Google Api_Ionic2 - Fatal编程技术网

Google maps 来自Google地理定位的数组长度(Ionic)

Google maps 来自Google地理定位的数组长度(Ionic),google-maps,ionic-framework,google-api,ionic2,Google Maps,Ionic Framework,Google Api,Ionic2,有没有人能告诉我使用什么正确的语法来返回GooglePlace搜索结果的值。比如,如果我的搜索返回5个位置,我想从数组中提取5的值,并在我的应用程序“找到5个位置!”中显示该信息。我已经设法弄到了一份附近地方的名单。但我不知道如何得到一个值 现在我使用这段代码访问GooglePlaces搜索结果数组 goToDirectionPage(index){ console.log(this.places); console.log("index" + index);

有没有人能告诉我使用什么正确的语法来返回GooglePlace搜索结果的值。比如,如果我的搜索返回5个位置,我想从数组中提取5的值,并在我的应用程序“找到5个位置!”中显示该信息。我已经设法弄到了一份附近地方的名单。但我不知道如何得到一个值

现在我使用这段代码访问GooglePlaces搜索结果数组

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);
      }
    });

  }


}

In places.html


找到的位置:{Places?.length}
{{place.name}+
{{place.neighborary}
平均评分:{{place.Rating}

In places.html


找到的位置:{Places?.length}
{{place.name}+
{{place.neighborary}
平均评分:{{place.Rating}

能否请您提供相关代码并说明您想做什么。你是说你只想在html中显示json列表中的所有项目吗?@PhilipBrack code和image added请包含相关代码并说明你想做什么。你是说你只想在html中显示json列表中的所有项目吗?@PhilipFrack代码和图像已添加
    <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>