如何在离子的不同页面上添加标签页答案

【问题标题】：How to add tabs pages on different pages in ionic如何在离子的不同页面上添加标签页
【发布时间】：2018-03-26 07:09:08
【问题描述】：

我已经检查了与此相关的各种其他问题，但没有得到回答，所以我正在回信。

tabs.html

<ion-tabs>
    <ion-tab [root]="tab1Root" tabIcon="ios-add"></ion-tab>
    <ion-tab [root]="tab2Root" tabIcon="ios-alarm"></ion-tab>
    <ion-tab [root]="tab3Root" tabIcon="ios-albums"></ion-tab>
    <ion-tab [root]="tab4Root" tabIcon="ios-alert"></ion-tab>
</ion-tabs>

tabs.ts

// all imports are done.

@Component({
    templateUrl: 'tabs.html'
})
export class TabsPage {

tab1Root = AlarmPage;
tab2Root = AddPage;
tab3Root = AlbumsPage;
tab4Root = AlertPage;

constructor() {

}

alert-page.ts

//all imports are made
// syntaxes are done correctly

export class AlertPage {
    constructor(navCtrl: NavController){}

 gotToOtherPage(){

    this.navCtrl.push(OtherPage);
}

}

other-page.ts

//When I navigate to other page from the above mentioned pages the tabs does not displayed on the OtherPage.

【问题讨论】：

标签： ionic-framework ionic2 ionic3

【解决方案1】：

无需以下功能即可导航到标签页

gotToOtherPage(){

    this.navCtrl.push(OtherPage);
}

只需删除它。此代码工作正常。但是您还必须将添加的页面包含在 app.module.ts 中

我为你做了一个示例项目，链接如下： TabsPage

在这里，我添加了一个称为详细信息页面的页面。看看这个

【讨论】：