Ionic2 navCtrl推不顯示推送頁

Question

我想從我的ExerciseListPage組件推送一個頁面（即VideoPage）。

我ExerciseListPage模板：

<button ion-item [hidden]="!isGroupShown(day)" *ngFor="let exercise of day.exercises" (click)="goTo(exercise.id)"> 
    {{exercise.name}}  
</button> 

組件：

import { Component } from '@angular/core'; 
import { NavController } from 'ionic-angular'; 
import { ExerciseListFactory } from './exercise_plan'; 
import { VideoPage } from '../video/video'; 

@Component({ 
    selector: 'page-list', 
    templateUrl: 'exercise_list.html', 
    providers:[ExerciseListFactory] 
}) 
export class ExerciseListPage { 

    public days : any[]; 
    public shownGroup; 


    constructor(public navCtrl: NavController, public exerciseFactory: ExerciseListFactory) { 

     this.navCtrl=navCtrl; 
     this.days=this.exerciseFactory.getall(); 

    } 

    goTo(exerciseId: any){ 

     this.navCtrl.push(VideoPage, { 
      exerciseId: exerciseId 
     }); 
    } 
} 

視頻組件：

import { Component } from '@angular/core'; 
import { NavController, NavParams } from 'ionic-angular'; 

@Component({ 
    selector: 'video', 
    templateUrl: 'video.html', 
}) 
export class VideoPage { 

    public test: string; 

    constructor(public navCtrl: NavController, public navParams: NavParams) { 

     this.navCtrl=navCtrl; 
     this.test="Test video"; 
     console.log(this.navParams.get('exerciseId')); 

    } 
} 

和視頻模板：

<ion-header> 
    <ion-navbar> 
    <ion-title> 
     Video 
    </ion-title> 
    </ion-navbar> 
</ion-header> 

<ion-content padding> 
    <h5>{{test}}</h5> 
</ion-content> 

在我app.module：

@NgModule({ 
    declarations: [ 
    MyApp, 
    VideoPage, 
    ExerciseListPage, 
    AnalyticsPage, 
    HomePage, 
    TabsPage 
    ], 
    imports: [ 
    IonicModule.forRoot(MyApp) 
    ], 
    bootstrap: [IonicApp], 
    entryComponents: [ 
    MyApp, 
    VideoPage, 
    ExerciseListPage, 
    AnalyticsPage, 
    HomePage, 
    TabsPage 
    ], 
    providers: [{provide: ErrorHandler, useClass: IonicErrorHandler}] 
}) 
export class AppModule {} 

和tabs.html：

<ion-tabs> 
    <ion-tab [root]="tab1Root" tabTitle="Home" tabIcon="home"></ion-tab> 
    <ion-tab [root]="tab2Root" tabTitle="Exercises" tabIcon="body"></ion-tab> 
    <ion-tab [root]="tab3Root" tabTitle="Analytics" tabIcon="analytics"></ion-tab> 
</ion-tabs> 

在我的控制檯我的視頻組件打印證件控制檯聲明然而沒有顯示在顯示屏。

我這麼想嗎？

Answer 1

在我的視頻組件的多餘的逗號存在：

@Component({ 
    selector: 'video', 
    templateUrl: 'video.html', 
}) 

templateUrl之後，除去逗號之後，模板被證明