Question

我正在使用ionic和angular4创建一个Android应用。我根据当前登录会话设置root用于导航应用程序组件。如果用户未登录，则会将root组件设置为root用户，如果用户会话可用，则会设置带有标签的Dashboard组件。

当用户已登录并且从应用程序组件设置仪表板到根导航时，

一切正常。

当我注销并登录时，登录时我设置了navCtrl的root，它显示了仪表板组件，显示了选中的选项卡，但是标签栏和导航栏中的选项卡选项不正确。当我选择第二个选项卡时，它是第二个选项卡的渲染组件，并突出显示第一个选项卡，显示导航栏中第一个选项卡的名称。

这是我正在做的事情：

app.component.ts

  if (userLoggedIn()) {
    this.rootPage = DashboardComponent
  } else {
    this.rootPage = LoginComponent
  }

app.component.html

<ion-nav [root]="rootPage"></ion-nav>

login.component.ts

onLogin(){
     this.navCtrl.setRoot(DashboardComponent)
}

dashboard.component.ts

@Component({
  template
})
export class DashboardComponent {
  suggestions: any = SuggestionsComponent
  advSearch: any = AdvancedSearchComponent
  favourite: any = FavouriteComponent
  settings: any = SettingsComponent

  constructor(private navCtrl: NavController) {

  }
}

dashboard.component.html

<ion-header no-border>
  <ion-navbar color="primary">
    <ion-title>Aayushyagathi</ion-title>
    <ion-buttons end>
      <button ion-button icon-only menuToggle>
        <ion-icon name="notifications"></ion-icon>
      </button>
    </ion-buttons>
  </ion-navbar>
</ion-header>

<ion-content>
  <ion-tabs color="primary">
    <ion-tab [root]="suggestions" tabIcon="home"></ion-tab>
    <ion-tab [root]="advSearch" tabIcon="search"></ion-tab>
    <ion-tab [root]="favourite" tabIcon="heart"></ion-tab>
    <ion-tab [root]="settings" tabIcon="cog"></ion-tab>
  </ion-tabs>
</ion-content>

我错过了什么？登录后是否有其他方式显示仪表板？

ionic-angular： 3.7.1

有角度： 4.4.5

标签在setRoot之后工作

0 个答案: