変数の角度 "|フィルター"式の結果配列を取得するにはどうすればよいですか？角度で

Question

は、あなたが

<input type="text" ng-model="query"> 

<table> 
    <tr ng-repeat="phone in phones | filter: query"> 
     <td>{{phone.vendor}}</td> 
     <td>{{phone.model}}</td> 
    </tr> 
</table> 

のようにフィルタ式を書くことができ、それはあなたがinputに入るqueryテキストに一致する電話機だけを表示するようにテーブルを更新します。

フィルタの対応する結果配列を取得するにはどうすればよいですか？変数（スコープ変数など）に現在表示されている[phone object]？

Answer 1

実際に、新しい変数を角度式のスコープに割り当てることができます。したがって、最も簡単な解決策は<tr ng-repeat="phone in (filteredPhones = (phones | filter: query))">です。 filteredPhonesは現在のスコープ内の変数になりました。this plnkr exampleを参照してください。

Answer 2

あなたのコントローラの内部では、あなたのqueryテキストに変更を見て、（あなたが注入しなければならないサービス$filterから'filter'という名前のフィルタを使用して）$filter('filter')ある{expression} | filter: {expression}のJavascriptの同等のものを、使用することができます。

あなたのHTMLスニペットがコントローラMyControllerによって制御されているとします。そして、あなたはそれを変更することができます。

myApp.controller("MyController", ["$scope", "$filter", function($scope, $filter) { 

    $scope.$watch('query', function(newVal, oldVal) { 
     console.log("new value in filter box:", newVal); 

     // this is the JS equivalent of "phones | filter: newVal" 
     $scope.filteredArray = $filter('filter')($scope.phones, newVal); 
    }); 
}]); 

たび、あなたquery変更、フィルタアレイは、あなたの$の範囲でfilteredArrayとして利用できるようになります、そして、あなたはあなたのスニペットで表現としてfilteredArray使用することができます。

---

すべてこれは実際にhttp://docs.angularjs.org/api/ng.$filterとhttp://docs.angularjs.org/api/ng.filter:filterに文書化されなければなりません。しかし、最初のリンクのドキュメンテーションはあまりにも疎であり、実際にはコメントから2番目のリンクにしか到達できません。私はそれをドキュメントに追加しようとしましたが、角をクローズしてドキュメントを作成した後、ブラウザを介してアクセスするだけでは機能しませんでしたが、APIをナビゲートするのは役に立たないエラーがなくサイレントに失敗しました。