なお、本連載ではAngularJSそのものに関しては解説しませんので、専門書として『AngularJSアプリケーションプログラミング』、姉妹連載『AngularJSではじめるJavaScriptフレームワーク開発スタイル』などを併せて参照してください。
はじめに
フィルターとは、与えられた変数（式）の値を加工するための仕組みです。主にテンプレート（Angular式）から利用します。以下に、AngularJS標準で用意されているフィルターをまとめておきます（注1）。
| 分類 | フィルター | 概要 |
|---|---|---|
| 文字列 | lowercase | 大文字→小文字の変換 |
| uppercase | 小文字→大文字の変換 | |
| json | オブジェクトをJSON文字列に変換 | |
| linky | URL／メールアドレスをリンクに整形 | |
| 配列 | orderBy | 配列を指定のキーで並べ替え |
| filter | 配列を指定の条件で検索 | |
| limitTo | 配列のm～n件目を抽出 | |
| 数値／日付 | number | 数値に桁区切り文字を付与、小数点以下の丸め |
| currency | 通貨形式に整形 | |
| date | 日付を整形 |
注1
個々のフィルターの用法については、「AngularJS TIPS」のような記事を参照してください。
ごく基本的な用途に限定されているせいか、「随分と少ないな」というのが第一印象かもしれません。もちろん、自作のフィルターを作成するのはそれほど難しいことではありませんが、よくありそうな機能をいちいち自作するのは車輪の再発明なのでは、と感じる人は多いのではないでしょうか。
そのような方は、本稿で紹介するAngular Filterの導入を検討してみてはどうでしょう。Angular Filterは、名前のとおり、AngularJSアプリで利用できるフィルターライブラリ。コレクション（配列）、文字列、数値演算、判定関連のフィルターが80種類近くも提供されています。AngularJS標準のフィルターに不満を感じたら、まずはAngular Filterに目的の機能がないか、確認してみるのも良いのではないでしょうか。自作を決断するのは、それからでも遅くはありません！
対象読者
- AngularJSについて基本的な概念を理解している方
- AngularJSでSPA（Single Page Application）を実装したいと考えている方
- AngularJS標準のフィルターでは不足だと感じている方
検証環境
この記事では、以下の環境でサンプルの動作を確認しています。
- AngularJS 1.4.6
- Angular Filter 0.5.5
- Chrome 45
- Firefox 40
- Internet Explorer 11
Angular Filterは、Bowerを利用することで、以下のコマンドでインストールできます。Bowerに関する詳細は、別稿『Web開発ライブラリを自動的に入手できるパッケージ管理ツールBower』を参照してください。
> bower install --save angular-filter
Angular Filterの機能は、大きくString（文字列操作）、Math（数値演算）、Boolean（判定）、Collection（配列操作）に分類できます。判定については、データ型や値の大小を判定するだけの、見た目そのままなフィルターなので、以下では、これを除くString／Math／Collectionについて、代表的なものを解説していきます。
