目次

AngularJS

要素

データバインディング

双方向データバインディングが内包されている。

データバインディングはController側の$scopeにバインドしたい変数を置き、View側に「ng-controller」を記載することでシームレスに行われる。

View側で値が変わった場合に任意の処理を呼び出す方法として $scope.$watch が提供されている。

ディレクティブ

いわゆるカスタムタグの仕組み。

新たにタグを作成することもできるし、任意のタグに新たな属性を持たせることができる。

タグにディレクティブが指定されると、対応するクラスが呼ばれ、任意の出力や任意の処理を行う。

ルーティング

デフォルトでは ngRoute を使用する。

複雑な画面遷移を行う場合には AngularUI.Router を使うほうが良い。 ステートマシンが表現できるからである。

ディープリンク

依存注入

テスト手法

ユニットテストのランナーには karma を使用するのがスタンダード。 karma はランナーであるため、ユニットテストフレームワークは別途必要。 Jasmine, Mocha など複数あるが、 BDDとTDDの両方に対応している点でMocha(chai) を推奨したい。

e2eテストには protractor の使用を推奨する。 protractor もランナーであるため、テストフレームワークは別途必要。 ユニットテストと同じにするため Mocha(chai) を推奨したい。

フォーム

テキスト

プルダウン

ラジオ

チェックボックス

ボタン

バリデーション

参照連動

サブウィンドウ

コンポーネント

REST API 通信

Restangular を使用することでAPIアクセスクラスを単一にできる。 Restangularは「getAll」「getById」といったメソッドを提供する。

トランザクション

画面またぎ