~Linux、MySQLからAJAXまでAngular2ルーターの遅延ロード(AsyncRoute)とrouterCanDeactivateの使用方法Angular2ルーターの遅延ロード(AsyncRoute)とrouterCanDeactivateの使用方法を確認し、簡単なサンプルを作成しました。※Angular2のβ版、TypeScriptを使って確認したものです。(1)遅延ロード(AsyncRoute)リファレンスマニュアルのサンプルはよく分からなかったため、以下記事を参照しました。2.0@RouteConfigのルーティング設定でAsyncRouteを使って設定します。ユーザーがルーティング先としてリンクをクリックした時点で該当コンポーネントがロードされるので、アプリ起動時の負荷を軽減できます。'Async'})])(2)routerCanDeactivate●CanDeactivateインタフェース・”routerCanDeactivate”ルートライフサイクルメソッドを定義する。・”routerCanDeactivate”は、コンポーネントがナビゲーション操作で除去してよいかを確認する際にルーターによって呼び出される。・”routerCanDeactivate”フックは、パラメータとして二つの”ComponentInstruction”を指定して呼び出される。二つのパラメータの一つ目は、ナビゲートされている現在のルート、二つ目のパラメーターが前のルートに該当する。・”routerCanDeactivate”がfalseをリターンあるいはresolveした場合、ナビゲーションはキャンセルされる。trueの場合はナビゲーションが継続され、コンポーネントは非活性化され、除去される。●ComponentInstruction・一つのコンポーネント用のルートの状態を表す。・”ComponentInstruction”のインスタンスは、”CanActivate”などのルートライフサイクルメソッドに渡される。●サンプルテキストボックスを編集中にブラウザの戻るボタンを押下すると編集内容を破棄してナビゲーションを続行するサンプル。最初にルーティングされた時点でコンポーネントがロードされる。コメントをキャンセルメールアドレスが公開されることはありません。コメントデータの処理方法の詳細はこちらをご覧ください。