ОШИБКА Ошибка: Uncaught (в обещании): TypeError: Невозможно прочитать свойство 'nativeElement' неопределенного в Angular и автозаполнение карт Google - PullRequest
Новая
       28

ОШИБКА Ошибка: Uncaught (в обещании): TypeError: Невозможно прочитать свойство 'nativeElement' неопределенного в Angular и автозаполнение карт Google

1 голос
/ 18 октября 2019

Я получаю эту ошибку при внедрении автозаполнения Google 

ERROR Error: Uncaught (in promise): TypeError: Cannot read property 'nativeElement' of undefined
TypeError: Cannot read property 'nativeElement' of undefined

Мой компонент похож на него: 

@ViewChild('search', {static:false})
  public searchElementRef: ElementRef;




ngOnInit() {
 this.mapsAPILoader.load().then(() => {
      this.getMyUbication();
      this.geoCoder = new google.maps.Geocoder;

      let autocomplete = new google.maps.places.Autocomplete(this.searchElementRef.nativeElement, {
        types: ["address"]
      });
      autocomplete.addListener("place_changed", () => {
        this.ngZone.run(() => {
          //get the place result
          let place: google.maps.places.PlaceResult = autocomplete.getPlace();

          //verify result
          if (place.geometry === undefined || place.geometry === null) {
            return;
          }

          //set latitude, longitude and zoom
          this.lat = place.geometry.location.lat();
          this.lng = place.geometry.location.lng();
          this.zoom = 12;
        });
      });
    });
}

В этой части я получаю сообщение об ошибке «Не удается прочитать свойство»nativeElement 'of undefined "

HTML код: 

<input type="text" id="geoloc" matGoogleMapsAutocomplete [(ngModel)]="geolocation" [ngModelOptions]="{standalone: true}" class="form-control" placeholder="Geolocalización" (keydown.enter)="$event.preventDefault()" autocorrect="off" autocapitalize="off" spellcheck="off" type="text" #search (onLocationSelected)="onLocationSelected($event)">
<ul>
   <li style="color: #bd1f2d" *ngIf="errors && errors['getmyubication']">{{errors['getmyubication']}}</li>
</ul>
<div *ngIf="showMap" class="map_st001" style="background: #DDDDDD;">
   <agm-map [latitude]="lat" [zoom]="zoom" [longitude]="lng" [scrollwheel]="null">
       <agm-marker [latitude]="lat" [longitude]="lng" [markerDraggable]="true" (dragEnd)="markerDragEnd($event)"></agm-marker>
   </agm-map>
</div>
...