TypeError:无法读取未定义的属性'Autocomplete'

问题描述 投票:0回答:1

错误错误:未捕获(承诺):TypeError:无法读取未定义的属性'Autocomplete'TypeError:无法读取未定义的属性“自动完成”

当我运行Angular应用程序时,此错误不断弹出。它说第25行的search.component.ts文件出了点​​问题。这是我的搜索组件

    /// <reference types="@types/googlemaps" />
import { Component, OnInit, ViewChild, ElementRef, NgZone } from '@angular/core';
import { FormControl } from '@angular/forms';
import { MapsAPILoader } from '@agm/core';

@Component({
  selector: 'app-search',
  templateUrl: './search.component.html',
  styleUrls: ['./search.component.scss'],
})
export class SearchComponent implements OnInit {

  autocomplete: any;
  @ViewChild('search')
  public searchElementRef: ElementRef;
  public searchControl: FormControl;

  constructor(private zone: NgZone, 
    private mapsAPILoader: MapsAPILoader) { }

  ngOnInit() {
    this.searchControl = new FormControl();

    this.mapsAPILoader.load().then(() => {
        let autocomplete = new window['google'].maps.places.Autocomplete(this.searchElementRef.nativeElement, {
        types: [],
        componentRestrictions: {'country': 'US'}
      });
      autocomplete.addListener('place_changed', () => {
        this.zone.run(() => {
          const place: google.maps.places.PlaceResult = autocomplete.getPlace();
          this.searchControl.reset();
        });
      });
    });
  }
}

如何解决此错误?

提前感谢

angular typeerror google-places-api
1个回答
0
投票
如果应用程序编译正常但出现错误,则为TS Lint错误。这是因为Lint找不到使用点.运算符访问的属性。您可以改用括号表示法[]解决它。尝试以下操作

let autocomplete = new window['google']['maps']['places']['Autocomplete'](this.searchElementRef.nativeElement, { types: ["address"] });

© www.soinside.com 2019 - 2024. All rights reserved.