Question

我在Android上有一个项目，如果用户已登录，我想更改动态确定的根页。

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

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

我已经尝试了一切，似乎无法弄明白这一点。如何根据本地存储中的值的状态更改加载的根页？

Answer 1

新的解决方案，现在更加优雅。我只是在到达存储后以编程方式设置根，并检查它是否应显示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;
    });
  }
}

以编程方式更改Ionic 2 root

1 个答案:

编辑前