使用Angular.js

Question

我需要使用angular.js在一个表的多列中实现多个过滤器选项。假设我在一列上应用了一个过滤器，并从表中过滤了该值。我在此表的2列中还有另一个过滤器，我需要基于第一个过滤值，当用户从第二个过滤器选项中选择任何值时，将再次过滤这些值相应的。我在下面解释我的代码。

  

subject.html：

<table class="table table-bordered table-striped table-hover" id="dataTable" >
<colgroup>
<col class="col-md-1 col-sm-1">
<col class="col-md-2 col-sm-2">
<col class="col-md-2 col-sm-2">
<col class="col-md-2 col-sm-2">
<col class="col-md-2 col-sm-2">
<col class="col-md-2 col-sm-2">
<col class="col-md-1 col-sm-1">
</colgroup>
<thead>
<tr>
<th>Sl. No</th>
<th>
<select style="width:100%; border:none; font-weight:bold;" ng-options="sub.name for sub in noCourse track by sub.value" ng-model="search">
<option value="">Course Name</option>
</select>
</th>
<th>
<select style="width:100%; border:none; font-weight:bold;" ng-options="sem.name for sem in noSemestersTable track by sem.value" ng-model="search1">
<option value="">Semester</option>
</select>
</th>
<th>Subject Name</th>
<th>Short Name</th>
<th>Edit</th>
</tr>
</thead>
<tbody id="detailsstockid">
<tr ng-repeat="sub in subjectData | filter:search.value" >
<td>{{ $index+1 }}</td>
<td>{{sub.course_name}}</td>
<td>{{sub.semester}}</td>
<td>{{sub.subject_name}}</td>
<td >{{sub.short_name}}</td>
<td>
<a href='#subject?s_i={{sub.subject_id}}'>
<input type='button' class='btn btn-xs btn-green' value='Edit'>  
</a>
</td>
</tr>   
</tbody>
</table>

在这里，我可以使用第一列（i.e-Course Name）过滤表中的值。这里我在下一列中有另一个选择选项（i.e-Semester）。当用户从中选择任何值时列出应再次过滤的值，该值基于第一个过滤值。简单地说，我可以说应用第二个过滤器选项，值只显示第一个过滤值，而不是整个表。