onsen ui + angular2 pushPage is already runningの解決

6215 ワード
onsenui Angular2 JavaScript JavaScript テキストリンク

問題

  • 初期表示のタイミングで、 ngOnInit に更に次のページへ遷移させる( resetToPage )記述をした。
  • Uncaught (in promise) pushPage is already running が発生した

問題コード

@Component({
  selector: "ons-page",
  template: require("./main.html"),
  styles: [require("./main.css")],
})

export class Main {

  constructor(private _navigator: OnsNavigator) {
  }

  ngOnInit() {
    if (isLogin()) {
      this._navigator.element.resetToPage(nextPage);
      return;
    }
  }
}

調査

  • 色々調べたけど、なんか良い解決方法がない。

解決

@Component({
  selector: "ons-page",
  template: require("./main.html"),
  styles: [require("./main.css")],
})

export class Main {

  constructor(private _navigator: OnsNavigator) {
  }

  ngOnInit() {
    if (isLogin()) {
      this.throughPage();
      return;
    }
  }

  private throughPage() {
    if(ons.isReady()) {
      this.goToNextPage();
      return;
    }

    ons.ready(() => this.goToNextPage());
  };

  private goToNextPage() {
    this._navigator.element.resetToPage(nextPage)
      .catch((reason) => {
        // pushPage is already running. の状態の時にリトライさせる
        this.goToNextPage();
      });
  }
}

参考

感想

　- Promise すげえええ。
　- リファレンスわかりづらいというか、onsen ui 辛い

pyenvツールを使用して複数のpythonバージョンを管理およびインストールする
php GET方式で入力されたすべての変数名と値を取得する:foreach使用法