Question

我试图找到我的代码没有返回我搜索过的附近地点的原因（使用google placesService）。当我在浏览器上检查我的代码时，我收到两个错误：

未处理的Promise rejection：Array [];区域：;任务：null;值：Array [] undefined polyfills.js：3：20095

未处理的承诺拒绝：数组[对象，对象，对象，对象，对象，对象，对象，对象，对象，对象，还有10个......];区域：;任务：null;值：Array [Object，Object，Object，Object，Object，Object，Object，Object，Object，Object，10 more ...] undefined

如果有人可以提供任何帮助。我想在我的离子卡中显示附近的地方列表，并让他们在地图上显示为标记。

.ts文件

import { Component } from '@angular/core';
import { NavController, NavParams } from 'ionic-angular';
import { Geolocation } from '@ionic-native/geolocation';

declare var google;
this.marker = [];


@Component({
  selector: 'page-gyms',
  templateUrl: 'gyms.html',
})
export class GymsPage {
  lat :any;
  lng: any;
  map: any;
  places: Array <any>;
  currentLocation: any;

  constructor(public navCtrl: NavController, public navParams: NavParams, public geolocation:Geolocation) {
  }

  ionViewDidLoad() {
    this.geolocation.getCurrentPosition().then( pos =>{
      this.lat = pos.coords.latitude;
      this.lng = pos.coords.longitude;
    }).catch(err => console.log(err));    

    this.gymMap().then((results : Array<any>) =>{
      for (let i=0; i < results.length; i++){
        this.createMarker(results[i]);
      }
      this.places = results;
    }, (status) => console.log(status));
  }

  gymMap(){
    this.currentLocation = new google.maps.LatLng(this.lat, this.lng);

    let mapOptions = {
      zoom: 10,
      center: this.currentLocation,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    }

    this.map = new google.maps.Map(document.getElementById("map"), mapOptions);

    let service = new google.maps.places.PlacesService(this.map);

    let request = {
      location: this.currentLocation,
      radius: '10000',
      types: ["gym"],
      rankBy: google.maps.places.DISTANCE
    };

    return new Promise((resolve, reject) =>{
      service.nearbySearch(request, (results, status)=>{
        if(status == google.maps.places.PlacesService.OK){
          resolve(results);
        }else{
          reject(results);
        }
      });
    });// end of Promise

  }//end of gymMap

  createMarker(place){
    let marker = new google.maps.Marker({
      map: this.map,
      animation: google.maps.Animation.DROP,
      position: place.geometry.location,
      title: place.name
    });

    console.log(place);

    google.maps.event.addListener(marker, 'click',()=>{
      let InfoWindow = new google.maps.InfoWindow({
        content: place.name
      });
      InfoWindow.open(this.map, marker);
    })
  }// end of createMarker

}//end of GymsPage

.html文件

<ion-header>

  <ion-navbar>
    <ion-title>Gyms Nearby</ion-title>
  </ion-navbar>
</ion-header>

<ion-content padding>
  <ion-buttons start>
    <button ion-button round full (click)="gymMap()">Find Gyms Near Me</button>
  </ion-buttons>

  <div #map id="map"> </div>
  <p>Lat: {{lat}}  Lng: {{lng}}</p>

  <div id="resultList">
    <ion-card>
      <ion-item ng-if = "places">
        Gyms Found: {{places?.length}}
      </ion-item>
    </ion-card>

    <ion-card id="result">
      <ion-item *ngFor = "let place of places; let i = index">
          {{place.icon}} + <br/>{{place.name}} <br/> {{place.vicinity}} <br /> Hours:{{place.opening_hours}} <br /> Average Rating: {{place.rating}}
      </ion-item>
    </ion-card>
  </div>
</ion-content>

未处理的Promise rejection：Array [];区域：<root>;任务：null;值：Array [] undefined离子

0 个答案: