Question

我正在尝试根据标签模板将Google地图插入到我的Ionic 2应用程序中。

在尝试初始化构造函数 this.map 方法之前，一切都运行正常。

import {Component} from '@angular/core';
import {Geolocation} from 'ionic-native';
import {NavController} from 'ionic-angular';

@Component({
  templateUrl: 'build/pages/map/map.html'
})
export class MapPage {
  constructor(private navCtrl: NavController) {

    this.map = null;

    this.loadMap();

   }

   loadMap() {
      var map = new google.maps.Map(document.getElementById('map'), {
      center: {lat: -34.397, lng: 150.644},
      scrollwheel: false,
      zoom: 8
    });
   }

}

现在，控制台抛出错误GET http://localhost:8100/build/js/app.bundle.js

我的终端也有错误：

错误TS2339：“MapPage”类型中不存在属性“map”。

发现很多类似的问题错误TS2339：属性'map'在'Observable'类型上不存在。

我已更新我的npm - 没有帮助。从我的代码中删除 this.map = null 方法现在不会使我的应用程序正常工作，相同的错误和离子服务命令不会加载我的应用程序（只有它的默认 index.html < / em> page）

如何将“地图”属性添加到“MapPage”类来解决问题？我的代码出了什么问题？

Answer 1

在使用之前，您需要声明map属性：

import {Component} from '@angular/core';
import {Geolocation} from 'ionic-native';
import {NavController} from 'ionic-angular';

@Component({
  templateUrl: 'build/pages/map/map.html'
})
export class MapPage {

  private map: any; // <- declare the variable

  constructor(private navCtrl: NavController) {

    this.map = null; // <- Now the variable exists so you can initialize it

    this.loadMap();

   }

   loadMap() {
      // Instead of using a new variable, use this.map to use the existing map property
      this.map = new google.maps.Map(document.getElementById('map'), {
      center: {lat: -34.397, lng: 150.644},
      scrollwheel: false,
      zoom: 8
    });
   }

}

“MapPage”类型中不存在“地图”属性

1 个答案: