1.4.9AngularJSは、コントローラで定めた配列の値を取り出して、HTMLドキュメントに動的にリストとして加えることができます。かたちが決まったいくつものデータを、差し込んで表示したいときに便利です。コントローラで値を与える」でコントローラを定めるサンプルとして書いたコード001です。チェックボックスとその右に示されるテキストの初期値がコントローラで与えられています。データバインディングにより、入力フィールドに書いたテキストがチェックボックスの右に表示され、チェックするとテキストに取り消し線が引かれます(図001)。コントローラに配列で複数の値を定めるAngularJSのcontroller()メソッドによりコントローラ(TodoListController)が定められたJavaScriptコードを書き替えます。つぎのように、初期値の変数(todos)は配列にして、同じプロパティ(textとdone)が備わった複数のオブジェクトを納めます。モジュールとコントローラをHTMLドキュメントに定める配列からエレメントを順に取り出すには、ng-repeatディレクティブを用います。配列"と定めれば、エレメントが変数に取り出されます。つぎのようにng-repeatディレクティブを<li>要素に加えると、要素はエレメントの数だけつくられ、変数(todo)に取り出されたそれぞれのエレメントのプロパティ値に応じて子要素の中身が定められます。here"></form></div>これで、コントローラ(TodoListController)に定めた配列(todos)からエレメントの数だけ<li>要素がつくられ、それぞれにテキストとチェックボックスの値(todo.textとtodo.done)が与えられます(図002)。テキストの表示やスタイルのデータバインディングは、もとのまま残っています。HTMLドキュメントの<script>要素と<body>要素の中身は、以下のコード001にまとめました。サンプル001としてファイルをフレームに掲げます。