离子延迟加载错误：未捕获（承诺）：无效链接 SecondPage答案

【问题标题】：Ionic Lazy loading Error: Uncaught (in promise): invalid link SecondPage离子延迟加载错误：未捕获（承诺）：无效链接 SecondPage
【发布时间】：2018-02-21 11:42:19
【问题描述】：

当我尝试懒惰地导航到第二页时，我收到Uncaught (in promise): invalid link SecondPage 错误。这是我的代码：

NavigateToSecondPage(): void{
    this.navCtrl.push('SecondPage');
}

第二页在使用 ionic-cli 生成的 Ionic 页面中。这是 ts 文件的样子。

@Component({
  selector: 'page-second',
  templateUrl: 'second.html',
})
export class SecondPage { 

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

我收到以下错误：

我做错了什么？

【问题讨论】：

标签： javascript ionic-framework

【解决方案1】：

您应该创建 second-module.ts 并更新 second.ts 添加 @IonicPage()

第二个模块.ts

import { NgModule } from '@angular/core';
import { IonicPageModule } from 'ionic-angular';
import { SecondPage } from './second';

@NgModule({
   declarations: [
    SecondDetailPage,
   ],
   imports: [
    IonicPageModule.forChild(SecondPage),
   ],
   exports: [
     SecondPage
  ]
})
export class SecondPageModule {}

【讨论】：

【解决方案2】：

我也经历过这个，你必须记住两件事才能使用离子延迟加载它需要 @IonicPage({}) 装饰器和相关的 module.ts 文件。 ionic lazy loading blog 中提到的 IonicPage 装饰器是 Ionic 如何在构建时为您的应用生成正确的映射和 URL slug，因此必须添加此装饰器

所以在 second.ts 中添加 @IonicPage 装饰器：

import { IonicPage } from 'ionic-angular';

@IonicPage({})
@Component({
  selector: 'page-second',
  templateUrl: 'second.html',
})
export class SecondPage { 
  constructor(public navCtrl: NavController, public navParams: 
  NavParams) {
  }
}

并将 second-module.ts 添加到第二页文件夹/组件中：

import { NgModule } from '@angular/core';
import { IonicPageModule } from 'ionic-angular';
import { SecondPage } from './second';

@NgModule({
  declarations: [
    SecondPage,
  ],
  imports: [
    IonicPageModule.forChild(SecondPage),
  ],
  exports: [
    SecondPage
  ]
})
export class SecondPageModule {}

【讨论】：