无法读取的未定义的属性 '查询' - 离子3

您好，有人可以帮我这个错误，我现在用的是anuglar 地图库，地理位置无法读取的未定义的属性 '查询' - 离子3

正如你所看到的，在图像中标记我的错误在查询中，真相nsoe 什么是

import { HomePage } from './../home/home'; 
import { Component, ViewChild } from '@angular/core'; 
import { IonicPage, NavController, NavParams,ViewController } from 'ionic-angular'; 
import { UbicacionService } from './../../providers/ubicacion/ubicacion'; 
import { UsuarioService } from './../../providers/usuario/usuario'; 
import { AgmMap } from '@agm/core'; 
import { MAP_STYLE } from '../../config/config'; 
import { Keyboard } from '@ionic-native/keyboard'; 

declare var google: any; 

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



    @ViewChild(AgmMap) private map: any; 
    @ViewChild('searchbar') searchBar; 

    usuario: any = {}; 
    public lat: number; 
    public lng: number; 
    public zoom: number; 
    usuarioSelecionado: any = {}; 
    siguiendo: boolean = false; 
    query:string; 
    // 
    styles: any = MAP_STYLE; 

    // 
    autocompleteItems: any; 
    autocomplete: any; 
    acService: any; 

    constructor(public navCtrl: NavController, public navParams: NavParams, 
    private _ubicacion: UbicacionService, 
    private _us: UsuarioService, 
    public viewCtrl: ViewController, 
    private keyboard: Keyboard) { 

    this._ubicacion.iniciar_localizacion(); 
    this._ubicacion.usuario 
     .subscribe(data => { 
     //console.log(data) 
     this.usuario = data; 
     if (this.siguiendo) { 
      //SIguiendo 
      for (let usuario of data) { 
      if (usuario.$key === this.usuarioSelecionado.$key) { 
       this.lat = usuario.lat; 
       this.lng = usuario.lng; 
      } 
      } 
     } 
     }); 
    } 


    ngOnInit() { 
    this.acService = new google.maps.places.AutocompleteService(); 
    this.autocompleteItems = []; 
    this.autocomplete = { 
     query: '' 
    }; 
    } 

    dismiss() { 
    this.viewCtrl.dismiss(); 
    } 

    ionViewDidLoad() { 
    setTimeout(() => { 
     this.searchBar.setFocus(); 
     this.keyboard.show(); 
    }, 600); 
    } 

    chooseItem(item: any) { 
    this.viewCtrl.dismiss(item); 
    } 

    updateSearch() { 
    if (this.autocomplete.query == '') { 
     this.autocompleteItems = []; 
     return; 
    } 
    let self = this; 
    let config = { 
     types: ['address'], // other types available in the API: 'establishment', 'regions', and 'cities' 
     input: this.autocomplete.query 
    }; 
    this.acService.getPlacePredictions(config, function (predictions, status) { 
     self.autocompleteItems = []; 
     if (predictions) { 
     predictions.forEach(function (prediction) { 
      self.autocompleteItems.push(prediction); 
     }); 
     } 
     else { 
     console.log('no predictions'); 
     } 
    }); 
    } 
}

这就是html。

<ion-searchbar #searchbar [(ngModel)]="autocomplete.query" [showCancelButton]="true" [cancelButtonText]="'Άκυρο'" [spellcheck]="false" [autocomplete]="false" [autocorrect]="false" (ionInput)="updateSearch()" (ionCancel)="dismiss()" placeholder="Please enter address..."> 
</ion-searchbar> 
<ion-list> 
    <ion-item *ngFor="let item of autocompleteItems" (click)="chooseItem(item)"> 
     {{ item.description }} 
    </ion-item> 
</ion-list>

我希望能与所提供的所有信息，他们可以帮助我，感谢

来源

2017-08-31 Ivan More Flores

它看起来像你的观点之前autocomplete在ngOnInit设置是越来越设置。所以autocomplete在[(ngModel)]="autocomplete.query"

要么仍然不确定的事情：

autocomplete: any = { 
     query: '' 
    };

变量声明中的类本身

或

使用安全导航操作?。

<ion-searchbar #searchbar [(ngModel)]="autocomplete?.query" [showCancelButton]="true" [cancelButtonText]="'Άκυρο'" [spellcheck]="false" [autocomplete]="false" [autocorrect]="false" (ionInput)="updateSearch()" (ionCancel)="dismiss()" placeholder="Please enter address..."> 
</ion-searchbar>

来源

2017-09-01 05:03:57

无法读取的未定义的属性 '查询' - 离子3

回答

相关问题