忙しい現代社会人のために習うより慣れる AngularJS のリンク集 #Angular

忙しくない人は、公式のチュートリアルを頭から全部やると良いです。めんどくさくてそっちはやってないので分かりません。

とりあえずここを開いてジャッヴァスクリプトを眺める
モジュールについて

基本中の基本。特に推奨セットアップのところを見ておけば良い。

こっちを読んだ方が幸せになれるかも。

どんなサンプルを読むにあたっても、DI の仕組みを知ってないと辛くなる。仕組み自体はよくできているが取っつきづらい。

特に 引数名で渡される実体が変わる 部分は慣れるまで気持ち悪い気がするし、ぼくは気持ち悪い。もっと言うと、minify した場合などで変数名が変わると動作しなくなるため基本的には変数名を指定して、実体を捕捉する必要がある。

var sampleApp = angular.module('sampleApp', []);

/** たとえば、Controller で $scope, $rootScope, $location を引数として受け取りたいとして */

// 1. 壊れるパターン
// minify されたコードにおいて function($a, $b, $c) {..} となるとすると、引数名で実体を捕捉できなくなるのでコードが動かなくなる
sampleApp.controller('hogeController', function($scope, $rootScope, $location) { .. });

// 2. 壊れないパターン
// 配列の先頭から受け取りたい引数を String で指定し、配列末尾に受け取る関数を入れるとその指定した順番で引数が渡される
// = 捕捉すべき引数名が変わらないので、関数側の引数名は変更されてもよい
sampleApp.controller('hogeController', ['$scope', '$rootScope', '$location', function($scope, $rootScope, $location) { .. }]);

他にも書き方は色々あるが、分かりづらいだけなので上記のようにしていすればいいと思う。

コントローラとスコープについて
- コントローラについて
- スコープについて
特に Angularのスコープオブジェクトとコントローラーの関連性についてを読んでおけば大丈夫だろう。
プロバイダーについて

Provider, Constant, Value, Factory, Service について。

どちらかというとこっちを参考にした方がわかりやすい。

公式の説明が取っつきづらく(パルスのファルシのルシがみたいな感じ)理解があまり及んでないんだが、サービスを定義する機能の1つとしての Provider とサービスを定義する機能を包括する名前としての Providers (つまり、Provider, Constant, Value, Factory, Service の全てをまとめた呼称)とが存在するということに注意してほしい。

そして、結構重要なところなのにあまり言及されている記事がない気がする。もしくは俺がアホすぎて理解できてないのどちらかだと思う。(多分後者)
ディレクティブについて

長いが一通り読んでおけばいいだろう。

標準のディレクティブ一覧も合わせて確認のこと。一通り覚えとくとさらにいい。
テンプレートについて

これはもうディレクティブと合わせて書き方だけ覚えておけば良い。
Routerまわり

書き方はこの辺りを参考に。

また、もっと高機能なライブラリとして angular-ui-router がある。

URL ベースのステートマシンのような感じで、 state や view をネストしたり、複数のテンプレートを扱えたり、それぞれに Controller を割り当てたりなど色々できる。ただ色々できる分、気をつけないと一気にカオスになりそうなので注意。

参考：Nested View, Multiple View の説明とか
テストまわり
- E2Eテスト
- ユニットテスト
tomof 神に感謝する

大体この辺まで読むと流れはくみ取れるはず。

あとは読み物として

とか一通り読んでおく。

これでもダメなら諦めた方が良い。人類には早すぎた。