Ionic3新特性 頁面懶載入2載入其他元件

在第一節中，我們介紹了頁面的懶載入方式，並進行了初步的分析，這裡，我們將進一步介紹如何配合頁面懶載入進行其他元件component、pipe、directive等的模組化，和載入使用。

首先說明一點，除了頁面外的這些其他元件，本質上是沒有實現懶載入的，只是通過將其進行模組化，在合適的頁面載入時，進行載入，從而基於頁面的懶載入機制間接實現了懶載入。

1、我們整合了md2、ngx-datatable、ng2-tree三套控制項庫；

2、我們自己寫了一些簡單的component:

3、在home.ts這個page中需要使用到這些自己寫的component，而且home.ts這個page是基於ionic的懶載入機制進行編寫載入的。

在自定義component所在的demo資料夾下新建模組宣告檔案mycomp.module.ts：

import  from '@angular/core';

import from 'ionic-angular';
import from 'ng2-tree';
import from 'md2';
import from '@swimlane/ngx-datatable';
import from './mytree';
import from './collapse';
import from './accordion';
import from './mydatatable';
@ngmodule()
export class mycompmodule {}

import  from '@angular/core';

import from 'ionic-angular';
import from './home';
import from '../../../components/test-tree/test-tree.module'
import from '../../../pages/demo/mycomp.module'
import from 'md2';
@ngmodule()
export class homepagemodule {}

1)、通過引入mycompmodule，引入了自定義的所有元件；

2)、因為是獨立的模組，所以如果想直接使用第三方的元件，比如這裡想使用md2的datepicker元件，依然需要使用如下兩種方式中的一種進行引入：

...

@ngmodule()
export class mycompmodule {}

哈哈，所以這裡又引入了乙個問題，模組的合理劃分，將是乙個很重要的問題。

參考

ionic and lazy loading pt 1

ionic and lazy loading pt 2

ionic3 實現懶載入方式 學習記錄

相關參考資料 對應的英文文件 class分別在home，about，contact資料夾下建立home.module.ts import from angular core import from home import from ionic angular ngmodule export clas...

ionic3 實現懶載入方式 學習記錄

原文出處 相關參考資料 對應的英文文件 分別在home，about，contact資料夾下建立home.module.ts import from angular core import from home import from ionic angular ngmodule export clas...

Ionic3與Angular4新特性

之前 17年3月底 angular4.0.0正式發布，這個月 4月十幾號 ionic3又發布了，很多人看到這個估計都是一臉懵圈，其實，angular4只是angular2的後續版本，ionic3也是ionic2的後續版本，只是因為angular現在嚴格按照版本更新策略來制定版本號，所以才會一下子跳到...