AngularJSアプリケーション開発ガイド

180

8

章 レシピ集

</thead>

<tbody id="teamListTable">

<tr ng-repeat="team in teamsList | filter:filterService.activeFilters |

filter:filterService.searchText">

<td>{{team.name}}</td>

<td>{{team.sport}}</td>

<td>{{team.city}}</td>

<td>{{team.featured}}</td>

</tr>

</tbody>

</table>

</div>

</div>

</body>

</html>

このテンプレートの中で、注目するべき点は「検索フィールド」「コンボボックス」「チェックボッ

クス」「繰り返しの表示」の

4

つだけです。それら以外については、今までに（何らかの形で）繰り返

し目にしてきたものばかりです。ここでは注目すべき

4

つの点について順に解説します。

8.2.1

 検索フィールド

検索フィールドの要素では、

ng-model

を使って

filterService.searchText

へのデータバ

インディングが行われているだけです。これ自体に大きな意味はありませんが、フィルタが検索

フィールドを利用する際の方法に大きな影響を及ぼします。

8.2.2

 コンボボックス

コ ン ボ ボ ッ ク ス は

2

つ 含 ま れ て い ま す。 両 者 の 仕 組 み は 同 一 で す。 こ れ ら は