Question

所以我试图将谷歌地图导入我的离子2应用程序。到目前为止一切都有效。我从@ angular / core导入VeiwChild包时会出现问题。因此，每次运行代码时，它都会给我同样的错误。

`模块＆＃39;＆＃34; C：/ Users / Jay / Documents / maps / node_modules / @ angular / core / core＆＃34;＆＃39;没有出口会员＆＃39; VeiwChild＆＃39;。

C：/Users/Jay/Documents/maps/src/pages/home/home.ts

导入{Component，VeiwChild}来自＆＃39; @ angular / core＆＃39;;

从＆＃39; ionic-angular＆＃39;导入{NavController}; `

这是我的index.html

＆＃13;

<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
  <meta charset="UTF-8">
  <title>Ionic App</title>
  <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
  <meta name="format-detection" content="telephone=no">
  <meta name="msapplication-tap-highlight" content="no">

  <link rel="icon" type="image/x-icon" href="assets/icon/favicon.ico">
  <link rel="manifest" href="manifest.json">
  <meta name="theme-color" content="#4e8ef7">
 
  <!-- cordova.js required for cordova apps -->
  <script src="cordova.js"></script>
  <script src="cordova.js"></script>
  <!-- un-comment this code to enable service worker
  <script>
    if ('serviceWorker' in navigator) {
      navigator.serviceWorker.register('service-worker.js')
        .then(() => console.log('service worker installed'))
        .catch(err => console.error('Error', err));
    }
  </script>-->

  <link href="build/main.css" rel="stylesheet">

</head>
<body>

  <!-- Ionic's root component and where the app will load -->
  <ion-app></ion-app>
  <script src="http://maps.google.com/maps/api/js?key=AIzaSyB0i4Rwgm2oyIOevkQNPydd1BwXJOV2WBk"></script>
  <!-- The polyfills js is generated during the build process -->
  <script src="build/polyfills.js"></script>

  <!-- The bundle js is generated during the build process -->
  <script src="build/main.js"></script>

</body>
</html>

＆＃13;

这是home.html代码

＆＃13;

<ion-header>
  <ion-navbar>
    <ion-title>
      Ionic Blank
    </ion-title>
  </ion-navbar>
</ion-header>

<ion-content padding>
<div #map id="map"></div>
</ion-content>

＆＃13;

这是我的home.scss代码

page-home {
    .ios, .md {

        home-page {

          .scroll {
            height: 100%
          }

          #map {
            width: 100%;
            height: 100%;
          }

        }

    }

}

最后这是我的home.ts代码

＆＃13;

import { Component, VeiwChild } from '@angular/core';
import { NavController } from 'ionic-angular';

declare var google;

@Component({
  selector: 'page-home',
  templateUrl: 'home.html'
})
export class HomePage {
	@VeiwChild('map') mapElement;
	map: any;

  constructor(public navCtrl: NavController) {

  }

  ionVeiwDidLoad()
  {
  	this.loadMap();
  }

  loadMap(){
 
    let latLng = new google.maps.LatLng(-34.9290, 138.6010);
 
    let mapOptions = {
      center: latLng,
      zoom: 15,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    }
 
    this.map = new google.maps.Map(this.mapElement.nativeElement, mapOptions);
 
  }
}

＆＃13;

我不完全确定为什么我继续犯这个错误。这是我用作参考的视频。 link

Answer 1

这只是一个错字。

此：

import { Component, VeiwChild } from '@angular/core';

应该是这样的：

import { Component, ViewChild } from '@angular/core';

View不是Veiw

注意：它在其他几个地方拼写错误，例如：

@VeiwChild('map') mapElement;

如何修复＆＃39;没有导出的成员＆＃39; VeiwChild＆＃39;＆＃39;离子

1 个答案: