モジュールとコントローラー (4/6)

では、、今回作成したサンプルコードを見てみましょう。今回のサンプルは、以下のような形になっていました。

angular.module('myapp',[])
    .controller('HeloController',
        function(){
            ……略……
        }
    }
);

angular.moduleでモジュールmyappを作成し、そのcontrollerを呼び出してHeloControllerを定義しています。コンストラクタ関数内では、taxプロパティと、calcWithTax、calcWithoutTaxの２つのメソッドを用意してあるのがわかりますね。

こんな具合に、「モジュールを作る」「コントローラーを作る」「コンストラクタ関数内で、必要な値や処理を実装する」というのが、モジュールとコントローラー利用の基本なのです。


コントローラーの中に用意されている「コンストラクタ関数」。これをいかに作成するかが、AngularJS利用のキモといってよさそうですね。

コンストラクタ関数は、JavaScriptのオブジェクトを生成するための関数です。これは、オブジェクト内に用意するプロパティやメソッドをその内部で定義しておきます。

function(){
    this.○○ = ☓☓; // プロパティの定義
    this.△△ = function(){……} // メソッドの定義
}

コンストラクタは、プロパティとメソッド（わかりやすくいえば、値を保管する変数と処理を実装する関数）をその内部で定義します。これは「this.○○」というように、this内のプロパティなどに代入する形で記述します。

thisは、コンストラクタ関数によって生成されるオブジェクト自身です。このようにしてオブジェクト自身のプロパティに値を代入することで、オブジェクトの中身が作られていきます。コンストラクタ関数は、AngularJSに限らずJavaScript全般で使われるテクニックなので、ここで使えるようになっておきましょう。

(by. SYODA-Tuyano.)

※リストが表示されない場合

AddBlockなどの広告ブロックツールがONになっているとリストなどが表示されない場合があります。これらのツールをOFFにしてみてください。