Angularコントローラでのフィルタリングについてよく分かりませんか？

Question

私はいくつかのAngularドキュメントを読んでいくつかの例を見てきましたが、私が必要としているようにフィルタリングする方法はまだ分かりません。うまくいけば、いくつか私のためにそれをクリアするのに役立つことができます。

私が持っているのは、Open、Closed、Pending、Urgentなどのステータスを持つレコードのリストを取得するAPIです。私は、すべてのレコードを元に戻してページに送付することを考えています。私はまた、それらのステータスのリストを取得するので、ドロップダウンリストに入力されます。ページがロードされると、最初に開くレコードを表示してから、ユーザーがドロップダウンリストからレコードを選択すると、別のレコードステータスに切り替わります。

this.filteredArray = filterFilter(this.array, {status:'Open'});のようなフィルタリングされたアイテムの配列にどのように署名することができますか？ng-repeatでそれを使用すると、その配列には '公開'レコードのみがあるため、他のレコードは利用できません。 ...正しい？

現在、約415レコードのレコードをすべて含む配列を使用すると、最初にすべてのレコードが表示され、誰かがドロップダウンリストから選択するまで、フィルタリングは行われません。

私は試してみて<span ng-repeat="vm in ctrl.allRecordsArray | filter={status:'Open'}">{{vm.name}}</span>の例を試しましたが、それは私にとってはうまくいかなかったようです。たとえそれがあったとしても、データを変更するためのドロップダウンリストにどのように結びつけるのか分かりません。

誰かがこれに類似したことをしたと確信しています。私は例を見つけることができません。デバッガで

UPDATE

、私は私のデータベースコール（428の記録）から返されたレコードを見ることができます。私は "StatusName"という名前のプロパティを見ることができ、このスクリーンショットでは "Closed"と表示されます。最初のレコードのほとんどが「閉鎖」ステータスになっているため、私はテスト用にClosedをフィルタリングしています。

フィルタリングを行わずに次のコードを使用すると、ページにレコードが表示されます。

<tr ng-repeat="call in vm.calls"> 

データをフィルタリングしようとすると、次のような操作を行っても、ページに書き込まれるものはありません。

<tr ng-repeat="call in vm.calls | filter={StatusName: 'Closed'}"> 

コードが正しいので、私はそれが動作しない理由として失われてるように見えます。それは、オブジェクトのプロパティ値に何らかの種類のスペースや文字があり、正しく一致したりフィルタリングしたりしないようなものです。

私はこれがまだ問題になっているのかどうかは確かではありませんが、その場合はドロップダウンリストのコードがあります。限り私の理解として、あなたの質問から

<select id="categoryId" 
     class="form-control" 
     ng-model="vm.selectedCategory" 
     ng-options="item.StatusName for item in vm.callStatus track by item.Id"> 
</select> 

Answer 1

、あなたはより定数名

を使用してdropdownlist model in your filteringのではなくを使用する必要があります。このように

<span ng-repeat="vm in ctrl.allRecordsArray | filter={status: your_dropdownlist_model}"> 

：へ

<span ng-repeat="vm in ctrl.allRecordsArray | filter={status:'Open'}"> 

フィルタリングはyour_dropdownlist_modelの値に基づいて行われます。ドロップダウンリストの値を変更すると、ドロップダウンリストの変更された値に従って自動的にフィルタされます。

Answer 2

フィルタに独自のモデルを与え、ユーザーがモデルを個別に変更できるようにすることができます。

あなたのビューで

Here is a working plunker.

：

<button ng-click="currentStatus = ''">All</button> 
<button ng-click="currentStatus = 'Open'">Open</button> 
<button ng-click="currentStatus = 'Closed'">Closed</button> 

<ul> 
    <li ng-repeat="vm in items | filter: {status: currentStatus}">{{vm.name}}</li> 
</ul> 

そして、あなたのコントローラで：

$scope.currentStatus = 'Open'; 
    $scope.items = [ 
    {'status': 'Open', 
    'name': 'Open1'}, 
    {'status': 'Open', 
    'name': 'Open2'}, 
    {'status': 'Open', 
    'name': 'Open3'}, 
    {'status': 'Open', 
    'name': 'Open1'}, 
    {'status': 'Closed', 
    'name': 'Closed1'}, 
    {'status': 'Closed', 
    'name': 'Closed2'}, 
    ];