首页 > 解决方案 > TypeError:无法读取 null 的属性“环境”

问题描述

我有一个使用@ionic-native/google-maps. 获取以下堆栈跟踪:

ERROR Error: Uncaught (in promise): TypeError: Cannot read property 'environment' of null
TypeError: Cannot read property 'environment' of null
    at Function.push../node_modules/@ionic-native/google-maps/index.js.Environment.setEnv (index.js:585)
    at TiedotPage.push../src/app/tiedot/tiedot.page.ts.TiedotPage.loadMap (tiedot.page.ts:41)
    at TiedotPage.<anonymous> (tiedot.page.ts:33)
    at step (tiedot.page.html:14)
    at Object.next (tiedot.page.html:14)
    at fulfilled (tiedot.page.html:14)

我的代码在这里:

import { Component, OnInit } from '@angular/core';
import { SijaintiService } from '../sijainti.service';
import { NavController, Platform } from '@ionic/angular';
import {
  GoogleMaps,
  GoogleMap,
  GoogleMapsEvent,
  GoogleMapOptions,
  CameraPosition,
  MarkerOptions,
  Marker,
  Environment
} from '@ionic-native/google-maps';

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

  info: any;
  map: GoogleMap;

  constructor(public service: SijaintiService,
    public navCtrl: NavController,
    private platform: Platform) {
  }

  async ngOnInit() {
    this.map = this.service.getInfo();
    await this.platform.ready();
    await this.loadMap();
  }

  goBack() {
    this.navCtrl.back()
  }

  loadMap() {
    Environment.setEnv({
      'API_KEY_FOR_BROWSER_RELEASE': 'MY_API_KEY',
      'API_KEY_FOR_BROWSER_DEBUG': 'MY_API_KEY'
    })

    let mapOptions: GoogleMapOptions = {
      camera: {
        target: {
          lat: 43.0741904,
          lng: -89.3809802
        },
        zoom: 18,
        tilt: 30
      }
    }

    this.map = GoogleMaps.create('map_canvas', mapOptions);

    let marker: Marker = this.map.addMarkerSync({
      title: 'Ionic',
      icon: 'blue',
      animation: 'drop',
      position: {
        lat: 43.0741904,
        lng: -89.3809802
      }
    });
    marker.on(GoogleMapsEvent.MARKER_CLICK).subscribe(() => {
      alert('klikattu');
    })
  }
}

标签: angularionic-frameworkionic4

解决方案


我不确定您的确切问题是什么,但是..您在 CLI 上使用的命令是什么?您可能需要在 CLI 上定位环境变量,例如这个

ionic cordova build browser -l

推荐阅读