Ionic ReferenceError:未定义谷歌

Question

我正在尝试查找用户输入的位置与固定位置之间的距离。我想使用来自谷歌平台的DistanceMatrix服务，但我一直得到"；谷歌没有被定义"；错误

import { Component } from '@angular/core';
import { Router } from '@angular/router';
import { AlertController, ToastController } from '@ionic/angular';
import { DataService } from '../data.service';
declare var google : any;
@Component({
selector: 'app-checkout',
templateUrl: './checkout.page.html',
styleUrls: ['./checkout.page.scss'],
})
export class CheckoutPage {
payment = ""
name  : string  = ""
phone : string = ""
address  : string  = ""
constructor(private alertController : AlertController, private router:Router, private dataService : DataService, private toastController : ToastController) { 

var to = new google.maps.places.Autocomplete(document.getElementById("address") as HTMLInputElement)
}

我还希望输入在用户键入时自动完成。

我已经坚持了三天了。任何帮助都将不胜感激。

Answer 1

我会稍微延迟一点回答这个问题，但有一种解决方法如下：

首先你需要安装@types/googlemaps:

npm install --save @types/googlemaps

然后，如果您使用的是Angular cli，请将谷歌地图添加到src/tsconfig.app.json:中的类型中

{
"extends": "../tsconfig.json",
"compilerOptions": {
"outDir": "../out-tsc/app",
"types": [
"googlemaps"
]
},
"exclude": [
"test.ts",
"**/*.spec.ts"
]
}

在那之后，你可能就不会再有这个问题了。

来源：https://roufid.com/angular-uncaught-referenceerror-google-not-defined/