Question

我从api中提取数据并在视图中显示结果。我想要实现的是能够使用多个参数过滤数据

WEB API

.controller('list_ctrl',function($scope,$http,$location){
    $scope.loading=true;
    $http.post('http://webapp.com/list.php').success(function(data){
    $scope.complains=data
    console.log(JSON.stringify(data));
    $scope.loading=false;

    }

HTML

<div class="col-sm-9">
<table width="100%" border="0" cellspacing="2" cellpadding="2" class="table">
  <tr>
    <td width="6%"><strong>Sort By</strong></td>
    <td width="7%"><select name="select" ng-model="search">
      <option value="$"></option>
      <option value="recieved">Recieved</option>
      <option value="pending">Pending</option>
      <option value="solved">Solved</option>
    </select></td>
    <td width="5%"><strong>Region</strong></td>
    <td width="10%"><select ng-model="region" >
  <option value="" disabled> </option>
  <option ng-repeat="item in complains | unique:'Region'" value="{{item.Region}}">{{item.Region}}</option>

</select></td>
    <td width="5%"><strong>District</strong></td>
    <td width="10%"><select name="select2" ng-model="district" >
      <option value="" disabled="disabled"> </option>
      <option ng-repeat="item in complains | unique:'District'" value="{{item.District}}">{{item.District}}</option>
    </select></td>
    <td width="4%"><strong>Route</strong></td>
    <td width="53%"><select ng-model="route" >
  <option value="" disabled> </option>
  <option ng-repeat="item in complains | unique:'Route'" value="{{item.Route}}">{{item.Route}}</option>

</select></td>
  </tr>
  <tr>
    <td>&nbsp;</td>
    <td colspan="7">&nbsp;</td>
  </tr>
</table>
  <div align="center" ng-if="loading">
  <img src="img/loader.gif" width="100" height="13" border="0" /> 
</div>
        <table class="table table-striped table-hover">
  <tr class="success">
    <td><strong>Customer Name</strong></td>
    <td><strong>Account Number</strong></td>
    <td><strong>Complaint Type</strong></td>
    <td><strong>Date of Complaint</strong></td>
    <td><strong>Status</strong></td>
    <td><strong>Options</strong></td>
  </tr>
  <tr ng-repeat="item in complains | orderBy:'-ID'">
    <td><span ng-class="{'unread':item.View_Status === 'unread'}">{{item.Customer_Name}}</span></td>
    <td>{{item.Account_Number}}</td>
    <td>{{item.Complain_type}}</td>
    <td>{{item.Date_of_Complain |date: 'dd MMMM yyyy'}}</td>
    <td>{{item.Complain_Status}}</td>
    <td><a ng-click="update_view(item)" href="#/complain_view/{{item.ID}}">View</a> | <a ng-click="update_view(item)" href="#/reply/{{item.ID}}">Reply </a></td>
  </tr>
  </table>

</div>

如何应用可按地区，区域以及上述HTML路由排序的过滤器。对此有何帮助？感谢

angularjs过滤器有多个下拉列表

0 个答案: