Question

我有一个Ionic应用程序，其中某些页面需要登录而某些页面不需要。当用户登录时，我想显示菜单，当没有登录时，用户应该看到没有菜单的页面。为此，我们使用两个根组件：SecurePage和PublicPage。 SecurePage有菜单，PublicPage没有。 ProductList页面需要登录，需要在SecurePage中呈现。在app.ts中，我们根据用户是否具有访问令牌来设置根页面：

ngOnInit() {

    this.translateService.addLangs(["en", "nl"]);
    this.translateService.setDefaultLang('en');

    this.authService.getAccessToken()
      .flatMap((access_token) => {
        if (access_token)
          return this.springApiService.isTokenValid(access_token);
        else
          return Observable.of(false)
      })
      .subscribe(isTokenValid => {

        if (isTokenValid)
          this.rootPage = SecurePage;
        else
          this.rootPage = PublicPage;
      });

  }

然后在SecurePage.ts中有：

  ionViewCanEnter(): Promise<boolean> {

    return this.authService.getPrincipal()
      .map(principal => {
        this.principal = principal;
        this.hasRoleSuperuser = this.authService.hasRoleSuperuser;
        this.hasRoleSales = this.authService.hasRoleSales;
        this.hasRoleAccountant = this.authService.hasRoleAccountant;
        this.hasRoleManager = this.authService.hasRoleManager;
        this.menuCtrl.enable(true);
        this.navCtrl.popAll()
          .then(() => this.navCtrl.setRoot('TodoListComponent'));
        return true;
      })
      .catch(error => {
        return Observable.of(false);
      }).toPromise();

  }

而且ProductList有：

@IonicPage({
  segment: 'product-list'
})

从菜单导航时一切正常。但是，如果在查看产品列表时刷新页面，则行为是不可预测的。有时它会再次路由到产品列表，这就是我想要的。但大多数情况下，安全页面会在产品列表之后加载

this.navCtrl.popAll()
          .then(() => this.navCtrl.setRoot('TodoListComponent'));

在最后一行踢，所以它路由到待办事项列表而不是产品列表。如何确保在设置根页后路由启动？或者是否有另一种方法可以实现多个母版页逻辑并且路由工作正常？

具有多个根组件的Ionic3路由

0 个答案: