2016-11-15 9 views
1

У меня есть простой код, который заставляет сотрудников с контроллера, и я хочу отфильтровать эти записи с разбиением на страницы. Когда я фильтрую любую страницу, все работает нормально, но когда я хочу фильтровать с другой страницы, она не фильтрует и ничего не показывает.angularjs не фильтрует другие страницы

Мой код выглядит следующим образом:

-filter.js

angular.module('MyApp', ['ui.bootstrap']).controller('MyController', function ($scope, EmployeesService) { 
    $scope.Employees = null; 
    $scope.currentPage = 1; 
    $scope.pageSize = 2; 
    $scope.maxSize = 100; 


    EmployeesService.GetEmployees().then(function (d) { 
     $scope.Employees = d.data; // Success 

    }, function() { 
     alert('Failed'); // Failed 
    }) 
}) 

.service('EmployeesService', function ($http) { 
    var service = {}; 
    service.GetEmployees = function() { 
     return $http.get('/Employees/GetEmployees'); 
    } 
    return service; 
}) 
.filter('start', function() { 
    return function (input, start) { 
     if (!input || !input.length) { return; } 
     start = +start; 
     return input.slice(start); 

    }; 
}); 

-Index.cshtml

<div ng-app="MyApp"> 
    <div ng-controller="MyController"> 

     <input type="text" ng-model="filterText" name="searchString" placeholder="Search for names.." class="form-control"><br /> 

     <div ng-repeat="emp in Employees |orderBy: 'employeeName'| filter: filterText | start: (currentPage-1) * pageSize | limitTo: pageSize" 
      class="alert alert-warning col-md-12">  

      <span ng-bind="emp.employeeName"></span> <b>:</b> 
      <span ng-bind="emp.employeePhoneNumber"></span> 

     </div> 
     <pagination ng-model="currentPage" total-items="Employees.length" items-per-page="pageSize"></pagination> 
    </div> 
</div> 

Спасибо заранее.

Извините за delaying.Here мой работает JSFiddle:

https://jsfiddle.net/neslisahozdemir/khbbbe47/4/

+0

, пожалуйста, создайте jsfiddle один раз. –

+0

i updated @ManishSingh –

+0

Я думаю, что он работает отлично! – Viplock

ответ

0

Как я понял ваш вопрос, я думаю, вы найдете свое решение путем изменения последовательности фильтра.

попробуйте использовать

<tr ng-repeat="emp in Employees | filter: filterText|orderBy: 'employeeName' |start: (currentPage-1) * pageSize | limitTo: pageSize" class="alert alert-warning col-md-12"> 

На данном фильтр работает страницу мудрой (значит, если вы наберете в «C» вы найдете данные на странице 1,2 одна записи каждой)

После изменения последовательность фильтра вы получите данные на одной странице (на первой странице 2 записи) для текста фильтра «C».

Найти обновленный fiddle

Надеется, что это поможет.

+0

Полезно знать это, так что вы можете принять ответ – Viplock

+0

Да, он решил мою проблему, спасибо, но это вызвало еще одну ситуацию .. Я правильно фильтрую, но, когда я перехожу на другую страницу, он все равно не фильтрует. Есть ли у вас какие-либо предложения? @Viplock –

+0

здесь вы смешиваете две вещи. либо вы можете фильтровать страницу данных, либо вы можете фильтровать данные в целом. на самом деле после фильтра ваш счет страницы должен быть уменьшен, потому что ваши данные фильтруются, и он заполняет только 2 страницы (например). то, что вы делали раньше, было фильтром страницы, и я предложил фильтр в целом. – Viplock