4.3
モデル
91
●
アプリケーションのスタイル設定、要素の表示と非表示(ホバー表示なども含む)の制御
●
入力と出力双方のデータについて、フィルタリングや表示形式の指定
AngularJS
でのテンプレートは、必ずしも
MVC
パターンでのビューに相当するわけではあり
ません。
AngularJS
のビューは、コンパイルされた実行可能なテンプレートです。つまり、この
ビューはテンプレートとモデルの組み合わせによって生まれます。
ビジネスロジックやふるまいについては、テンプレートに含まれるべきではありません。これら
はコントローラの中に記述しなければなりません。テンプレートをシンプルな状態に保てば、関心
の分離が可能になるとともに、ユニットテストだけでもほとんどのコードをテストできるようにな
ります。テンプレートは別途シナリオテストでテストすればよいのです。
「それでは、
DOM
の操作はどこで行われるのか」と思われた読者もいるかもしれません。実は、
DOM
の操作はコントローラもテンプレートも行っていません。これは
AngularJS
のディレクティ
ブが受け持ちます(コードの重複を防ぐために、
DOM
を操作するサービスの中で使われることも
あります)。
GutHub
のコードの中で、ディレクティブの例も紹介します。
モデル、コントローラ、テンプレートの協調関係や位置付けについての解説はこのくらいにし
て、コードについて見てゆきましょう。
4.3
モデル
このアプリケーションでのモデルは、レシピを表すだけのとてもシンプルなもので