Replace or hide tabs

I started a tabs project which has default 3 tabs, I need help in couple of things.

1. How can I hide tabs properly on specific pages? I have tried this approach which works but not sure if its the correct way, so when I go to somePage I have this implementation

constructor(){

this.tabBarElement = document.querySelector(’.tabbar.show-tabbar’);

}

ionViewWillEnter() {
this.tabBarElement.style.display = ‘none’;
}

ionViewWillLeave() {
this.tabBarElement.style.display = ‘flex’;
}

2. If I have tabs #HomePage, #AboutPage, #ContactPage at home page, when user click on #ContactPage tab I would like to replace #AboutPage and #ContactPage tabs with #ProfilePage and #DetailsPage tabs, and when user click on #HomePage it should display default tabs again.

Thanks for any help.

ionic info

global packages:

@ionic/cli-utils : 1.5.0
Cordova CLI      : 7.0.1 
Ionic CLI        : 3.5.0

local packages:

@ionic/app-scripts              : 2.0.0
@ionic/cli-plugin-cordova       : 1.4.1
@ionic/cli-plugin-ionic-angular : 1.3.2
Cordova Platforms               : android 6.2.3
Ionic Framework                 : ionic-angular 3.5.0

System:

Node       : v7.10.0
OS         : Linux 4.4
Xcode      : not installed
ios-deploy : not installed
ios-sim    : not installed
npm        : 4.2.0

i have the same problem, did you resolve that ?