2016-06-01 5 views
0

私のプロジェクトでは、配列をループしているテーブルがあります。ユーザーにデータを表示するか、すべてのデータを表示するかのいずれかで、テーブルをフィルタリングするオプションが必要です。AngularJSで名前で配列をフィルタリングする方法

私はこのようなコントローラがあります。

var app = angular.module('app', []); 
app.controller('Ctrl',[], function($scope){ 
$scope.LoggedInTeacher = 'Papa Johns'; 
$scope.Teachers = [{Id: 1, Name: 'Patricia Johns' , Subject: 'Science'}, 
        {Id: 2, Name: 'Veronica Smith' , Subject: 'Maths'}, 
        {Id: 3, Name: 'Clifford Harris' , Subject: 'Music'}, 
        {Id: 4, Name: 'Papa Johns' , Subject: 'Catering'}, 
        {Id: 5, Name: 'Bill Gates' , Subject: 'Information Tech'}, 
        {Id: 6, Name: 'Papa Johns' , Subject: 'Dance'} 
] 


}) 

; 

//Here is my View - filtering my array 


<div ng-controller = "Ctrl"> 

<table> 

<tr> 
<th> Name </th> 
<th> Subject</th> 

</tr> 

<tr ng-repeat=" t in Teachers"> 

<td>{{t.Name}}</td> 
<td>{{t.Subject}}</td> 
</tr> 

</div> 

細かい作業では上記の文脈をしかし、私は、ユーザー名でログインして結果をフィルタリングする必要があります。だから私はそうのようなデータをフィルタリングするための2つのチェックボックスを持つようにしたいテーブルの下に例えば:

<input type="checkbox" ng=model="filter table by LoggedInTeacher "> Show only Mine 
<input type="checkbox" ng-model="show all"> Show All 

私はこれを達成するためにについてどのように行きますか?

あなたは次のようなフィルタを使用することができますあなたの

答えて

2

保存フィルタ。各オプションで、ユーザーがチェックボックスを選択すると、filterValueの値を変更します。 NGリピートで

<input type="checkbox" ng-click="filterValue = LoggedInTeacher"> Show only Mine </input> 
<input type="checkbox" ng-click="filterValue = ''"> Show All </input> 

、あなたの表現を変更します。

<tr ng-repeat="t in Teachers | filter: filterValue"> 
+0

はとてもありがとうございました! – 1future

0

ありがとう:

<tr ng-repeat=" t in Teachers | filter: {name: 'Bill Gates'}"> 

代わりの{名:「ビル・ゲイツ」}あなたは、フィルタを定義する変数を置くことができます。

0

これは使用できます。このような 'filterValue' のようにユーザーが入力した

<tr ng-repeat=" t in Teachers | filter: {name: LoggedInTeacher}"> 
関連する問題