在运行时动态更改Ionic Cordova TabRoot

Tabs.html：

<ion-tabs>
  <ion-tab [root]="tab1Root" tabTitle="Home" tabIcon="md-home"></ion-tab>
  <ion-tab [root]="tab2Root" tabTitle="About" tabIcon="md-information-circle"></ion-tab>
  <ion-tab [root]="tab3Root" tabTitle="My Account" tabIcon="md-log-in"></ion-tab>
</ion-tabs>

和Tabs.ts

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

  tab1Root = HomePage;
  tab2Root = AboutPage;
  tab3Root = LoginPage;

  constructor()
  {}

}

我想做的是,一旦我在tab3Root(LoginPage)上登录,我想将其更改为LoggedinPage.
维护其他标签功能正常.

那可能吗？如果是,请问怎么样？

谢谢

添加信息：检查/编辑此链接,其中包含我的代码作为示例
stackblitz.com/edit/ionic-yff2sx

this.navCtrl.setRoot(this.loggedInPage);

Please refer this working demo

我假设home.ts为登录页面并从主页调用loggedIn页面.单击主页中的“登录”页面按钮后,“登录”页面内容将替换主页内容.