AngularJS で遊ぶのはこれが初めてで、実際には、入門チュートリアルに従っています。チュートリアルにない部分を少しだけ追加して、チュートリアル スクリプトを自分の理解に合わせて微調整することにしました。
基本的に、チュートリアルで使用される電話オブジェクトは次のとおりです。
{
"age": 1,
"id": "motorola-xoom",
"imageUrl": "img/phones/motorola-xoom.0.jpg",
"name": "MOTOROLA XOOM™",
"snippet": "The Next, Next Generation..."
}
私がやろうとしていたのは、リストを並べ替えるために自動入力された選択ボックスを追加することでした:
<select ng-model="orderProp">
<option ng-repeat="(key, value) in phones[0]" value="{{key}}">
{{labels[key]}}
</option>
</select>
モデルラベルをコントローラーに追加しました:
$scope.labels = {
"name": "Phone name",
"snippet": "Description",
"age": "Newest",
};
上記の3つのプロパティのみをフィルタリングしたかったことを除いて、期待どおりに機能していたので、次のようにフィルタリングするためのカスタム述語関数を追加するのは簡単だと思います:
$scope.isPhonePropFilterable = function (propName) {
console.log('it DOES NOT get here!!!');
return propName == 'name' || propName != 'snippet' || propName != 'age';
};
これをng-repeatに追加しました
<option ng-repeat="(key, value) in phones[0] | filter:isPhonePropFilterable" value="{{key}}">
驚いたことに、思ったほど簡単ではなく、フィルター関数が呼び出されませんでした。
ここでそれを見てください:プランカー
私は何か悪いことをしましたか?
編集: ng-repeatフィルターは、オブジェクトではなく配列のフィルタリングのみをサポートします。配列param が配列でない場合、フィルター関数は戻ります...