使用 MapsAPILoader 时无法解析参数 - Angular

Question

我正在尝试按照下面列出的教程使用 Angular 8 实现自动完成功能。我已经在 Angular 的不同版本中多次实施此地理定位器自动完成功能，但今天在 Angular 8 上我收到错误：

Can't resolve parameters when using MapsAPILoader

教程

https://brianflove.com/2016/10/18/angular-2-google-maps-places-autocomplete/

我的代码：

import { ElementRef, NgZone, OnInit, ViewChild } from '@angular/core';
import { FormControl } from '@angular/forms';
import { } from 'googlemaps';
import { MapsAPILoader } from '@agm/core';

export class App implements OnInit {
  ...
  constructor(
    private mapsAPILoader: MapsAPILoader,
    private ngZone: NgZone
  ) {}

  ngOnInit() {}

如果我删除这一行：

private mapsAPILoader: MapsAPILoader

错误消失

Answer 1

刚刚看了教程。如果您只是从 App class 复制代码，那么它不会起作用。您需要添加组件装饰器：

@Component({
  selector: 'my-app',
  styles: [`
    agm-map {
      height: 300px;
    }
  `],
  template: `
    <div class="container">
      <h1>Angular 2 + Google Maps Places Autocomplete</h1>
      <div class="form-group">
        <input placeholder="search for location" autocorrect="off" autocapitalize="off" spellcheck="off" type="text" class="form-control" #search [formControl]="searchControl">
      </div>
      <agm-map [latitude]="latitude" [longitude]="longitude" [scrollwheel]="false" [zoom]="zoom">
        <agm-marker [latitude]="latitude" [longitude]="longitude"></agm-marker>
      </agm-map>
    </div>
  `
})
export class App implements OnInit {}

使用 MapsAPILoader 时无法解析参数 - Angular

Can't resolve parameters when using MapsAPILoader - Angular

google-maps

google-maps-api-3

angular

agm-map