ReferenceError:“未定义google" [英] ReferenceError: "google is not defined"

问题描述

我使用 Angular Google Maps 以我的角度显示Google地图7个应用程序.

I use Angular Google Maps to display a google map in my angular 7 app.

我需要使用Google Maps键入来完成以下操作:

I needed google maps typings to do something like this:

allowedBounds = new google.maps.LatLngBounds(
    new google.maps.LatLng(51.130739, -0.868052), // SW
    new google.maps.LatLng(51.891257, 0.559417) // NE
);

所以我做了npm install --save-dev @typings/googlemaps

我尝试了多种尝试来解决该错误，但没有一个对我有用.

I tried many different things to try to resolve the error but none worked for me.

import {} from 'googlemaps'
declare const google: any; 

在tsconfig.json中，我有"typeRoots": ["node_modules/@types"]；在tsconfig.app.json中，我有"types": ["googlemaps"]

In tsconfig.json I have "typeRoots": ["node_modules/@types"] and in tsconfig.app.json "types": ["googlemaps"]

应用程序编译没有错误，但是在chrome控制台中出现错误:

The app compiles without errors but in chrome console I get an error:

ERROR ReferenceError: "google is not defined"

推荐答案

此错误最有可能是自allowedBounds初始化以来，尚未加载Google Maps API的那一刻起诸如google.maps.LatLngBounds之类的地图对象尚不可用. agm-map随loader ，可加载Google Maps库异步.

This error most likely occurs since the moment when allowedBounds is getting initialized, Google Maps API is not yet loaded and therefore Google Maps objects like google.maps.LatLngBounds are not yet available. agm-map ships with loader which loads Google Maps library asynchronously.

为了确保Google Maps API已加载，请 MapsAPILoader服务可以按如下所示使用:

In order to ensure Google Maps API is loaded, MapsAPILoader service could be utilized as demonstrated below:

export class AppComponent  {
  bounds = null;

  constructor(private mapsAPILoader: MapsAPILoader) {
    this.mapsAPILoader.load().then(() => {
      this.bounds = new google.maps.LatLngBounds(
        new google.maps.LatLng(51.130739, -0.868052), // SW
        new google.maps.LatLng(51.891257, 0.559417) // NE
      );
      console.log(this.bounds);
    });
  }

}

此处是一个演示，演示了如何为给定范围

Here is a demo which demonstrates how to fit a map for a given bounds

这篇关于ReferenceError:“未定义google"的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！