ルート定義のresolve

ルート定義のwhenメソッドの第二引数のresolveでは、コントローラに注入したいデータを取得する処理を定義することが出来ます。

/// <reference path="scripts/typings/angularjs/angular.d.ts" />/// <reference path="scripts/typings/angularjs/angular-route.d.ts" />

module TypeScriptAngularJSApp2 {
    angular.module("MyApp", ["ngRoute"])
        // コントローラの定義。value1とvalue2をresolveから注入してもらう// 今回はコントローラの定義は手抜き。
        .controller("Page1Ctrl", ($scope, value1, value2) => {
            $scope.value = value1 + value2;
        })
        .config(($routeProvider: ng.route.IRouteProvider) => {
            $routeProvider
                .when("/", {
                    // Page1Ctrlにresolveでvalue1とvalue2をresolveで取得してインジェクションする// 見た目はviews/page1.html                    templateUrl:"views/page1.html",
                    // コントローラはPage1Ctrol                    controller:"Page1Ctrl",
                    // コントローラに設定する値を決める処理を書く                    resolve: {
                        value1: () => "Hello",
                        value2: () => "World"
                    }
                });
        });
}

この例だとresolveに指定しているvalue1とvalue2の関数の結果がコントローラのvalue1とvalue2にわたってきます。コントローラ内では、単純に足してるだけなので、最終的な結果はHelloWorldという文字列になるという寸法です。

views/page1.htmlに{{value}}と書いておけば表示されますが、ここでは結果とHTMLは省略します。