离子 2 延迟加载组件

Question

我的应用程序非常大，有大约 30 个组件和页面，我将它们全部加载到我的 app.module.ts 中，有时应用程序会变慢。我想知道它是否有什么关系。

我的问题：延迟加载组件并在 Ionic 2 中使用角度 2 功能(更多模块(的正确方法是什么？

Answer 1

从 Ionic 3 开始，你可以延迟加载组件。

只需为每个组件/页面创建一个新模块。

下面是主页模块的外观示例：

import { MyApp } from './app.component';
import { HomePage } from '../pages/home/home';
@NgModule({
  declarations: [MyApp, HomePage],
  imports: [ ... ],
  bootstrap: [IonicApp],
  entryComponents: [MyApp, HomePage],
  providers: [ ... ]
})
export class AppModule {}

创建模块后，将@IonicPage()附加到组件：

import { Component } from '@angular/core';
import { IonicPage } from 'ionic-angular';
@IonicPage()
@Component(... )
export class HomePage { ... }

现在，您可以将页面/组件用作字符串，而无需使用 import 语句：

rootPage:any = 'HomePage';

有关更多描述性答案，请查看此离子延迟加载博客文章。