2017-06-08 75 views
1

我無法在側面菜單中單擊時打開頁面。頁面無法在側面菜單中單擊時打開 - ionic 2 app

這是我app.component.ts:

this.pages = [ 
       { title: 'NFC Page', component: NfcPage, note: 'NFC Page' }, 
       { title: 'Student Details', component: StudentDetails, note: 'Student Details' }, 
    ]; 

這是我app.module.ts:

@NgModule({ 
    declarations: [ 
    StudentDetails, 
    NfcPage, 
], 
entryComponents: [ 
    StudentDetails, 
    NfcPage, 
    ], 

這是我的nfc.ts頁:

import {Component} from '@angular/core'; 
    import {IonicPage, NavController, NavParams} from 'ionic-angular'; 
    import {NFC, Ndef} from '@ionic-native/nfc'; 

    @IonicPage() 
    @Component({ 
     selector: 'page-nfc', 
     templateUrl: 'nfc.html', 
    }) 
    export class NfcPage { 

     constructor(public navCtrl: NavController, 
        public navParams: NavParams, 
        private nfc: NFC, 
        private ndef: Ndef) { 
} 
} 

這是我的nfc.html頁面:

<ion-header> 
    <ion-navbar> 
     <button ion-button menuToggle> 
      <ion-icon name="menu"></ion-icon> 
     </button> 
     <ion-title>NFCPage</ion-title> 
    </ion-navbar> 
</ion-header> 

<ion-content padding> 
    <p>NFC Page!</p> 
</ion-content> 

學生詳細信息頁面打開正常,但是當我點擊「Nfc頁面」時,沒有任何反應。

回答

0

我已經設法找到解決方案。問題出在nfc.ts模塊的constructor。這兩個私有參數(private nfc: NFCprivate ndef: Ndef)似乎是從我使用的插件中分解出來的。我從constructor中刪除了這兩個參數,我可以打開該頁面。可悲的是,控制檯或其他地方沒有出現異常情況。希望它能幫助別人。

1

開放通過你需要做這個頁面作爲rootpage當您單擊側菜單上option.You可能會發現下面的代碼側面菜單頁: -

app.html:

<ion-menu id="myMenu" [content]="mycontent" > 
    <ion-content> 
     <ion-list> 
      <ion-item ion-item small menuClose (click)="nav.setRoot(pages.nfc)"> 
       <ion-icon name="home" item-left menuClose ></ion-icon> NFC 
      </ion-item > 
       <ion-item small menuClose (click)="nav.setRoot(pages.std_detils)"> 
       <ion-icon ios="ios-contact" md="ios-contact" item-left ></ion-icon> Student Details 
      </ion-item> 
     </ion-list> 
    </ion-content> 
</ion-menu> 

<ion-nav #mycontent [root]="rootPage"></ion-nav> 

app.component.ts:

this.rootPage = NfcPage; 
    this.pages = { 
     "nfc": NfcPage, 
     "std_detils": StudentDetails, 

     }; 
相關問題