Adding tabs to a modal view


#1

In my app, I have a page with a list of renters and when I click on a renter a modal view will be shown with the renter details. But I want to modify the modal view to have two tabs, one for the renter details and the other one for comments but when I try this I keep getting a black screen!!! Why???


#2

RenterTapsPage.ts

import { Component } from ‘@angular/core’;
import { NavController, NavParams, ViewController } from ‘ionic-angular’;

import { RenterPage } from ‘…/renter/renter’;
import { CommentsPage } from ‘…/comments/comments’;

@Component({
selector: ‘page-renter-tabs’,
templateUrl: ‘renter-tabs.html’,
})
export class RenterTabsPage {

renterPage = RenterPage;
commentsPage = CommentsPage;

constructor(public navCtrl: NavController,
public navParams: NavParams,
public viewCtrl: ViewController) {

}

ionViewDidLoad() {
console.log(‘ionViewDidLoad TabsPage’);
}

onDismiss(){
this.viewCtrl.dismiss();

}
}

RenterTapsPage.html

<ion-tabs tabsPlacement="bottom">
    <ion-tab [root]="renterPage" tabIcon="list-box" tabTitle="Renter" ></ion-tab>
    <ion-tab [root]="commentsPage" tabIcon="star" tabTitle="Comments"></ion-tab>
</ion-tabs>