簡體   English   中英

如何修復Ionic中的'沒有導出的成員'VeiwChild'錯誤

[英]How to fix 'has no exported member 'VeiwChild'' error in Ionic

因此,我正在嘗試將Google Maps導入我的Ionic 2應用程序。 到目前為止,一切都正常。 我從@ angular / core導入VeiwChild包時出現問題。 因此,每次我運行代碼時,都會給我同樣的錯誤。

`模塊'“ C:/ Users / Jay / Documents / maps / node_modules / @ angular / core / core”'沒有導出的成員'VeiwChild'。

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

從'@ angular / core'導入{Component,VeiwChild};

從'ionic-angular'導入{NavController}; `

這是我的index.html

 <!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> 

這是home.html代碼

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

這是我的home.scss代碼

page-home {
    .ios, .md {

        home-page {

          .scroll {
            height: 100%
          }

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

        }

    }

}

最后是我的home.ts代碼

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

我不完全確定為什么我繼續收到此錯誤。 這是我用作參考的視頻。 鏈接

它只是一個錯字。

這個:

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

應該是這樣的:

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

View NOT Veiw

注意:它在其他幾個地方也拼寫錯誤,例如:

@VeiwChild('map') mapElement;

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM