Question

我正在尝试从我的ExerciseListPage组件中推送一个页面（即VideoPage）。

我的ExerciseListPage模板：

 @Override
public void onCheckedChanged(RadioGroup group,
                             int checkedId)
{
    switch (checkedId)
    {
        case R.id.option1:
           // settextview to correct here
            break;
        case R.id.option2:
           //set textview to wrong here
            break;

        default:
            break;
    }

组件：

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

    }
}

在我的app.module中：

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

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

和tabs.html：

@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 {}

我的视频组件中的控制台语句在我的控制台中打印id，但显示屏上没有显示任何内容。

我错过了什么吗？

Answer 1

在我的视频组件中，有一个额外的逗号：

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

在templateUrl之后删除逗号后，显示了模板

Ionic2 navCtrl推送不显示推送页面

1 个答案: