Ionic 2スーパータブがブラウザで正しく表示されない

Question

Ionic CLI v3.5.0とIonic2スーパータブv3.0.2 を使用していますが、タブが正しく表示されません。タブをクリックすると、ページは変更されますが、表示されません。

ここは私のapp.module.tsです。私は、ドキュメントに示されているようにSuperTabsModule.forRoot（）を追加しました。

import { BrowserModule } from '@angular/platform-browser'; 
import { ErrorHandler, NgModule } from '@angular/core'; 
import { IonicApp, IonicErrorHandler, IonicModule } from 'ionic-angular'; 
import { SplashScreen } from '@ionic-native/splash-screen'; 
import { StatusBar } from '@ionic-native/status-bar'; 
import { SuperTabsController} from 'ionic2-super-tabs'; 



import { MyApp } from './app.component'; 
import { ExplorePage } from '../pages/explore/explore'; 
import { SuperTabsModule } from 'ionic2-super-tabs'; 
import { CoachingsPage } from '../pages/coachings/coachings'; 
import { TutorsPage } from '../pages/tutors/tutors'; 


@NgModule({ 
    declarations: [ 
    MyApp, 
    ExplorePage, 
    CoachingsPage, 
    TutorsPage 
    ], 
    imports: [ 
    BrowserModule, 
    IonicModule.forRoot(MyApp), 
    SuperTabsModule.forRoot(), 
    ], 
    bootstrap: [IonicApp], 
    entryComponents: [ 
    MyApp, 
    ExplorePage, 
    CoachingsPage, 
    TutorsPage 
    ], 
    providers: [ 
    StatusBar, 
    SplashScreen, 
    {provide: ErrorHandler, useClass: IonicErrorHandler} 
    ] 
}) 
export class AppModule {} 

これは、私のtab.tsファイルです。ここで私のページは遅延ロードを使用しないので、ここにSuperTabsModuleを追加していません。私はそれを追加しましたが、うまくいきませんでした。ここで

import { Component } from '@angular/core'; 
import { IonicPage, NavController, NavParams } from 'ionic-angular'; 
import { CoachingsPage } from '../coachings/coachings'; 
import { TutorsPage } from '../tutors/tutors'; 


/** 
* Generated class for the ExplorePage page. 
* 
* See http://ionicframework.com/docs/components/#navigation for more info 
* on Ionic pages and navigation. 
*/ 
@IonicPage() 
@Component({ 
    selector: 'page-explore', 
    templateUrl: 'explore.html', 
}) 
export class ExplorePage { 

    tab1Root:any = CoachingsPage; 
    tab2Root:any = TutorsPage; 

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

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

} 

がtabs.htmlファイルです：

<super-tabs> 
<super-tab [root]="tab1Root" title="Top Tutors"></super-tab> 
<super-tab [root]="tab2Root" title="Top Coaching"></super-tab> 
</super-tabs> 

Answer 1

それはしばらくしているが、私はあなたが持っている同じ問題を抱えていたと私は最終的には超タブのCSSがロードされていないことがわかりました。 CSSを取得してテストとしてファイルの1つに入れることができます。