TypeError：无法读取未定义的属性“自动完成”

Question

错误错误：未捕获（承诺中）：TypeError：无法读取未定义的属性“自动完成” 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();
        });
      });
    });
  }
}

如何解决这个错误？

提前致谢

Answer 1

如果应用程序编译正常并出现错误，则它是一个 TS Lint 错误。这是因为 Lint 找不到使用点 . 运算符访问的属性。您可以改用括号符号[] 来解决它。试试下面的

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

更多关于属性访问器的信息：https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Property_accessors