ionic-framework – 以编程方式更改Ionic 2 root

发布时间：2020-12-14 01:07:14 所属栏目：Linux 来源：网络整理

导读：我在 Android上有一个项目,我想在用户登录时动态确定更改根页面. 在app.component.ts中.我正在检查本地存储以查找用户是否已登录的标志.如果是,则将它们带到第2页并且不显示登录页面.如果不是,则会向他们显示登录页面. 我的问题是本地存储GET是一个Promise,

我在 Android上有一个项目,我想在用户登录时动态确定更改根页面.

在app.component.ts中.我正在检查本地存储以查找用户是否已登录的标志.如果是,则将它们带到第2页并且不显示登录页面.如果不是,则会向他们显示登录页面.

我的问题是本地存储GET是一个Promise,它在有机会之前完成app.component.ts的构造函数(它进入登录屏幕并显示它)然后当Promise完成时它切换到第二个屏幕.如果他们已经登录,我根本不想显示登录屏幕.

我已经尝试了一切,似乎无法解决这个问题.如何根据本地存储中值的状态更改加载的根页？

解决方法

新的解决方案,现在更加优雅.我只是在到达存储后以编程方式设置根,并检查它是否应显示Home或Login.

@Component({
    template: `<ion-nav #nav></ion-nav>`
)
export class MyApp {

    @ViewChild('nav') nav: Nav;

    constructor(platform: Platform,storage: Storage) {
        this.storage.get('isLogged').then(logged => {
           if (logged) {
              this.nav.setRoot(HomePage);
           } else {
              this.nav.setRoot(LoginPage);
           }
    });
}

在编辑之前

不是一个优雅的解决方案,我会留下来看看是否有更好的方法,但在我的情况下,我用* ngIf推迟了根的展示.

我的AppComponent是这样的：

@Component({
   template: `<ion-nav *ngIf="showRoot" [root]="rootPage"></ion-nav>`
})
export class MyApp {

  rootPage:any = LoginPage;

  showRoot = false;

  constructor(platform: Platform,storage: Storage) {

    this.storage.get('isLogged').then(logged => {
        if (logged) {
           this.rootPage = HomePage;
        }
        this.showRoot = true;
    });
  }
}

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!