web-dev-qa-db-ja.com

ionic 3、遅延読み込みタブコンポーネント

コンポーネントをインポートせずに、遅延読み込みを使用してionic 3タブアプリを作成しようとしています。

私のapp.component.tsで

 rootPage:string = "Tabs";

tabs.htmlで

<ion-tabs>
<ion-tab [root]="Favorites" tabTitle="fav" tabIcon="star"></ion-tab>
<ion-tab [root]="libaray" tabTitle="Library" tabIcon="book"></ion-tab>
</ion-tabs>

favorite.module.tsで

import { NgModule } from '@angular/core';
import { IonicPageModule } from 'ionic-angular';
import { Favorites } from './favorites';

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

これまでのところ、タブページは正常に読み込まれますが、ビューはありません(空白のページ)。遅延読み込みで[root]属性を使用しているという問題があると思います!それを修正する方法は?

ありがとう

9
Amr.Ayoub

チェック ここ

<ion-tab [root]="Favorites" tabTitle="fav" tabIcon="star"></ion-tab>
<ion-tab [root]="libaray" tabTitle="Library" tabIcon="book"></ion-tab>

ここで、libarayFavoritesはコンポーネントの変数である必要があります。

コンポーネントで、ionicページと同等の文字列をTabs.tsの変数に設定してみてください:

export class Tabs{
 Favorites:any='Favorites';
 libaray:any = 'libaray'; //assuming you tried to give the page class name to `root`.
}

:必ずnotページモジュール内以外の場所に遅延ロードされたページをインポートします。

12
Suraj Rao