0

タブ テンプレートに基づいて Ionic 2 アプリケーションに Google マップを挿入しようとしています。

コンストラクター関数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: プロパティ 'map' はタイプ 'MapPage' に存在しません。

問題エラー TS2339: プロパティ 'map' がタイプ 'Observable' に存在しません。

npm を更新しましたが、役に立ちませんでした。コードからthis.map = nullメソッドを削除しても、アプリが機能しなくなりました。同じエラーと ionic serve コマンドがアプリをロードしません (デフォルトのindex.htmlページのみ) 。

問題を解決するために、そのプロパティ「マップ」を「MapPage」クラスに追加するにはどうすればよいですか? 私のコードで何が間違っていますか?

4

1 に答える 1

2

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
    });
   }

}
于 2016-09-04T09:38:17.540 に答える