基于http的Angularjs过滤器得到

Question

这里是我的Javascript代码我如何实现基于此输入的搜索过滤器？我目前对angularjs很陌生。

var app = angular.module('myApp', ['angularUtils.directives.dirPagination']); 
        app.controller('workShiftController', function($scope, $http) { 
         $http.get("getWorkShiftArchiveJson?workshift_id="+getCookie('shiftId')) 
         .success(function (response) {$scope.workshift_archive = response; 

         }); 
        }); 

这里是我的HTML代码

<div ng-app="myApp" ng-controller="workShiftController"> 
    <center><h1 style="font-size:2em;">Workshift Archive History</h1></center> 
    <hr> 
     <table class="table table-striped" at-table at-paginated at-list="filteredList" at-config="config"> 
     <thead> 
      <tr> 
       <th>Work Shift Name</th><th>First Name</th><th>Middle Name</th><th>Last Name</th> 
       <th>Hours Per Day</th><th>Start Time</th><th>End Time</th><th>Period From</th><th>Period To</th> 
      </tr> 
     </thead> 
     <tbody> 
      <tr dir-paginate="x in workshift_archive | itemsPerPage: 10 "> 
      <td>{{x.workshift_name}}</td> 
      <td>{{ x.first_Name }}</td> 
      <td>{{ x.middle_Name }}</td> 
      <td>{{ x.last_Name }}</td> 
      <td>{{ x.hours_per_day }}</td> 
      <td>{{ x.start_time }}</td> 
      <td>{{ x.end_time }}</td> 
      <td>{{ x.period_from }}</td> 
      <td>{{ x.period_to }}</td> 
      </tr> 
     </tbody> 
     </table> 
    <dir-pagination-controls></dir-pagination-controls> 
    </div> 

Answer 1

为了让您充分实现过滤我需要知道数据属性你。我已经实现了一个基于http get.you的sample plunker过滤器，可以按名字过滤。

我html实施

<ul ng-controller="MyController as controller"> 
    <input type="text" placeholder='enter first name' ng-model="search.first_Name"> 

<table class="table table-striped" at-table at-paginated at-list="filteredList" at-config="config"> 
    <thead> 
     <tr> 
      <th>Work Shift Name</th><th>First Name</th><th>Middle Name</th><th>Last Name</th> 
      <th>Hours Per Day</th><th>Start Time</th><th>End Time</th><th>Period From</th><th>Period To</th> 
     </tr> 
    </thead> 
    <tbody> 
     <tr ng-repeat="x in controller.mydata| filter:search"> 
     <td>{{x.workshift_name}}</td> 
     <td>{{ x.first_Name }}</td> 
     <td>{{ x.middle_Name }}</td> 
     <td>{{ x.last_Name }}</td> 
     <td>{{ x.hours_per_day }}</td> 
     <td>{{ x.start_time }}</td> 
     <td>{{ x.end_time }}</td> 
     <td>{{ x.period_from }}</td> 
     <td>{{ x.period_to }}</td> 
     </tr> 
    </tbody> 
    </table>