Angular Ionic 4空白项目中的简单选项卡

我已经创建了一个新项目，使用

ionic start myApp blank

现在我需要将tab添加到项目中，我在页面中创建文件夹选项卡，并在选项卡中创建两个文件

tabs.html

tabs.ts

在tabs.html中

<ion-tabs>
  <ion-tab [root]="homePage" tabTitle="Home" tabIcon="bulb" ></ion-tab>
  <ion-tab [root]="reclamationsPage" tabTitle="Reclamations" tabIcon="settings"></ion-tab>
</ion-tabs>

在app.module.ts中 我有补充

declarations: [
    MyApp,
    HomePage,
    LoginPage,
    ReclamationsPage,
    TabsPage
  ],
  imports: [
    BrowserModule,
    HttpModule,
    HttpClientModule,
    IonicModule.forRoot(MyApp)
  ],
  bootstrap: [IonicApp],
  entryComponents: [
    MyApp,
    HomePage,
    LoginPage,
    ReclamationsPage,
    TabsPage
  ],

在app.component.ts中，我使用

rootPage:any=TabsPage更改
rootPage:any

但当我执行我的代码时，我在屏幕空白的页面上没有看到图像

离子信息

Ionic:

   ionic (Ionic CLI)  : 4.2.1 (C:\Users\android\AppData\Roaming\npm\node_modules\ionic)
   Ionic Framework    : ionic-angular 3.9.2
   @ionic/app-scripts : 3.2.0

Cordova:

   cordova (Cordova CLI) : 8.1.2 (cordova-lib@8.1.1)
   Cordova Platforms     : android 7.1.1
   Cordova Plugins       : cordova-plugin-ionic-keyboard 2.1.3, cordova-plugin-ionic-webview 2.2.0, (and 8 other plugins)

System:

   Android SDK Tools : 26.1.1 (C:\Users\android\AppData\Local\Android\sdk)
   NodeJS            : v8.12.0 (C:\Program Files\nodejs\node.exe)
   npm               : 6.4.1
   OS                : Windows 10

tabs.html

tabs.html

嗨，它的工作现在我必须改变这个tab1Root=ReclamationsPage；tab2Root=主页；谢谢你让我快乐：）仅供参考；由于使用了离子标签，所以不需要使用指定的插座。**可以找到当前演示**（@ionic/angular 4.0.1）+说明。嗨，它的工作现在我必须更改此标签1 root=ReclamationsPage；tab2Root=主页；谢谢你让我快乐：）仅供参考；由于使用了离子标签，因此不需要使用命名插座。**当前演示**（@ionic/angular 4.0.1）+可以找到解释。
Ionic:

   ionic (Ionic CLI)  : 4.2.1 (C:\Users\android\AppData\Roaming\npm\node_modules\ionic)
   Ionic Framework    : ionic-angular 3.9.2
   @ionic/app-scripts : 3.2.0

Cordova:

   cordova (Cordova CLI) : 8.1.2 (cordova-lib@8.1.1)
   Cordova Platforms     : android 7.1.1
   Cordova Plugins       : cordova-plugin-ionic-keyboard 2.1.3, cordova-plugin-ionic-webview 2.2.0, (and 8 other plugins)

System:

   Android SDK Tools : 26.1.1 (C:\Users\android\AppData\Local\Android\sdk)
   NodeJS            : v8.12.0 (C:\Program Files\nodejs\node.exe)
   npm               : 6.4.1
   OS                : Windows 10

<ion-tabs [selectedIndex]="myIndex">
    <ion-tab [root]="tab1Root" tabIcon="star"></ion-tab>
    <ion-tab [root]="tab2Root" tabIcon="home"></ion-tab>
</ion-tabs>

import { IonicPage, NavController, NavParams } from 'ionic-angular';

@IonicPage()
@Component({
  selector: 'page-tabs',
  templateUrl: 'tabs.html',
})

export class TabsPage{
    tab1Root = 'ReclamationsPage';
    tab2Root = 'HomePage';
    myIndex: number;
}

constructor(public navCtrl: NavController, public navParams: NavParams){
    this.myIndex = navParams.data.tabIndex || 0;
}