Anglar学習ノート(二)

コントローラ:
JavaScriptの中の構造関数のように、スコープを強化するために使用され、コントローラがngcontroller命令によってDOMに追加されると、
ngはコントローラの構造関数を呼び出してコントローラオブジェクトを生成し、新しいサブレベルのスコープを作成します.
注:このコンストラクタでは、スコープは$scopeパラメータとして注入され、ユーザーコードがアクセスできるようになります.
 
使用コントローラ:
1、イニシャル$scopeオブジェクト

//      attrName     value
$scope.attrName = value;

 
2、$scopeオブジェクトに行為を追加する(方法)

//      func
$scope.func = function([params]) {...}

 
任意のオブジェクト(または元のタイプの変数)がscopeに追加されるとscopeの属性となり、テンプレート/ビューの呼び出しのためにデータモデルとして使用されます.
任意の方法がscopeに追加された後、テンプレート/ビューでAnglar式またはAnglarのイベントプロセッサによって呼び出すこともできます.
 
注:Anglarのテンプレートは、モデル、コントローラからユーザがブラウザで見ることができるビューに情報を指定する声明式の図です.
 
 コントローラを使用しない場合:
1、どんな形式のDOMの場合:コントローラは業務ロジックのみを含むべきです.
2、フォーマット入力:Anglarフォームコントロールを使用します.
3、フィルタ出力:Anglarフィルタで代替
4、コントローラ間で状態または無状態のコードを多重化する:Anglarサービスを使用して代替する.
5、他の部品を管理するライフサイクル
注:コントローラに属さない論理をサービスにカプセル化し、コントローラでは注入(DI)依存サービスを呼び出して、コントローラの「純度」を維持することができます.
 
コントローラとscopeオブジェクトの関連を実現します.
1、ngControllerコマンド:新しいscopeを作成します.
2、$routeルーティングサービス
 
スコープ:
1、アプリケーションデータモデルを記憶するオブジェクト
2、式の実行コンテキストを提供します.
3、作用域の階層はDOMのツリー構造に対応する.
4、スコープは式の変化をモニターして、事件を伝播することができます.
追加:
1、スコープは($watch)方法を提供して、データモデルの変化を監督します.
2、スコープはAnglarに触発されないデータモデルの変更をAnglarの制御範囲に導入する方法を提供しています.
3、作用域はプロトタイプチェーンに基づいてその親の作用域の属性を継承する仕組みを提供しています.
4、作用域は表現の実行環境を提供しています.この属性を持つ作用域で実行しなければ意味がありません.
注:カスタムコマンドでは、テンプレートのリンクフェーズにおいて、コマンドは動作領域の各表現をモニターするための$watch関数を設定します.
$watchは、機能領域における属性変化時にコマンドを通知することを許可し、さらにこの変化によってDOMを再レンダリングし、その変更された属性値を更新することができるようにする.
 
a、コントローラ-->スコープ-->ビュー(DOM)
b、コマンド --> スコープ-->ビュー(DOM)
コントローラとコマンドは互いに分離されており、ビューとの間も分離されている(結合度が低い)ため、テストに対応する作業効率が大幅に向上します.
注:作用域の構造はDOM構造に対応しており、最上層はDOMツリーのルートノードと同じで、Anglarアプリケーション毎にroot scopeが一つしかなく、サブスコープは複数あり得る.
スコープオブジェクトは、命令やコントローラなどのAnglar要素があるDOMノードに関連しています.DOMノードでは、スコープというオブジェクトをキャプチャすることができます.