Ionic3選項卡不適用於延遲加載

Question

閱讀后，官方文檔這里之后花費了大量的時間，我的代碼不會加載與離子標簽和懶裝載片。

這是我的.ts文件

import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams } from 'ionic-angular';

@IonicPage()
@Component({
  selector: 'page-name',
  templateUrl: 'name.html',
})
export class NamePage {

  tab1: "Tab1Page";
  tab2: "Tab2Page";
  tab3: "Tab3Page";

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

  ionViewDidLoad() { }

}

這是我的.html文件

<ion-content>

     <ion-tabs>
        <ion-tab [root]="tab1" tabIcon="reorder"></ion-tab>
        <ion-tab [root]="tab2" tabIcon="pin"></ion-tab>
        <ion-tab [root]="tab3" tabIcon="search"></ion-tab>
      </ion-tabs>

  </ion-content>

這是我的app.component.ts：

  rootPage:any = 'NamePage';

編譯代碼后，頁面是帶有隱藏組件的白頁。 對於視圖選項卡，我輸入以下代碼：

.tabbar {
    opacity: 1;
}

但按鈕仍無法正常工作; 點擊一個按鈕后沒有任何變化（白色屏幕仍然存在）。

我還把控制台日志

ionViewDidLoad() {
    console.log('ionViewDidLoad NamePage');
}

控制台中唯一存在的就是這個。

有人可以給我一個建議嗎？

Answer 1

嘗試這個：

import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams } from 'ionic-angular';
import { HomePage } from ....
@IonicPage()
@Component({
  selector: 'page-name',
  templateUrl: 'name.html',
})
export class NamePage {

 tab1: any;
 tab2: any;
 tab3: any;

constructor(public navCtrl: NavController, public navParams: NavParams) {
  this.tab1 = HomePage
......(other pages)
}

ionViewDidLoad() { }

}