AngularJS でブラウザの「戻る」ボタン(バックボタン)のクリックを検出する方法

Onsen UI を使ってウェブサイト(というよりもほぼアプリ)を開発中なのですが、ブラウザのバックボタンを押されたタイミングを検知したいと思ったのですが、あいにくそのようなイベントは用意されていません。

Onsen UI は AngularJS の上に作られたフレームワークなのですが、以下のようにすれば拾えるようです。

むむむ。Stack Overflow で見つけたんですが、コードを見ても、何でこれでブラウザバックを取得できるのか、よく分かりません。

そこで、コンソールに各変数の値を書き出して、動きをモニターしてみました。

ページ上のリンクやボタンをクリックしてページを遷移させると、まず「$location.path()」の値が変化し、ページの遷移が完了した後に「$locationChangeSuccess」が更新される様子が見て取れました。

一方、ブラウザのバックボタンでページが遷移する場合には、これが逆の順番になるようです。まず「$locationChangeSuccess」が更新され、その後に「$location.path()」の値が変化します。

そのタイミングの違いを利用したのが、上のコードということになります。なるほどですね。

ところでこのコードでは、$rootScope に actualLocation というプロパティを追加してロケーション情報を保持しているのですが、わざわざ $rootScope を汚さなくても、コントローラ内のローカル変数に保持しとけば十分じゃないの? などと思ったりするのですが、何か理由があるのかな?
また時間があるときに検証してみたいと思います。

スポンサーリンク
広告(大)
広告(大)

シェアする

  • このエントリーをはてなブックマークに追加

フォローする

スポンサーリンク
広告(大)