2016-10-24 57 views
0

我想在行數據表中放入序列號。我希望它符合所用的分頁。如何根據分頁在行數據表中放置行號

HTML:

<div class="widget-content table-responsive table-container" ng-controller="getEmployeesController" > 

       <table ng-table="employeesList" show-filter="true" class="table table-striped table-bordered"> 
        <tr ng-repeat="employee in $data"> 
         <td data-title="'#'">{{$index + 1}}</td> 
         <td data-title="'First Name'" sortable="'firstName'" filter="{ 'firstName': 'text' }"> 
          {{employee.firstName}} 
         </td> 
<td data-title="'Last Name'" sortable="'lastName'" filter="{ 'lastName': 'text' }"> 
          {{employee.lastName}} 
         </td> 
</tr> 
       </table> 
    </div> 

控制器:

myApp.controller('getEmployeesController', ['$scope', 'employeeServices', 'dataTable', '$window', '$timeout', '$filter', function ($scope, employeeServices, dataTable, $window, $timeout, $filter) { 
    employeeServices.getEmployees().then(function (result) { 
     $scope.data = result.data; 
     //employeeServices.getStateId("Available").then(function(result){ 
     employeeServices.getStateId("Available").then(function (result) { 
      $scope.benchId = result.data.id; 
     }); 
     if (!result.data.error) {   
      dataTable.render($scope, '', "employeesList", result.data); 
     } 
}]); 

Services.js:

myApp.factory('employeeServices', ['apiServices', "$location", function (apiServices, $location) { 

    var factoryDefinitions = { 
     getEmployees: function() { 
      return apiServices.getFromTalentPool('/EmployeeState?state=&pageNumber=0&pageSize=0').success(function (data) { 
       return data; 
      }); 

} 

    return factoryDefinitions; 
} 

App.js:

myApp.factory('dataTable', ['$filter', 'ngTableParams', function($filter, ngTableParams) { 

    var factoryDefinition = { 
     render: function($scope, config, componentId, data) { 

     if(!config) config ={}; 
     var config = angular.extend({}, {page:1, count:10}, config) 

     $scope[componentId] = new ngTableParams(config, { 
      total: data.length, // length of data 
      getData: function ($defer, params) { 
       // organize filter as $filter understand it (graph object) 
       var filters = {}; 
       angular.forEach(params.filter(), function (val, key) { 
        var filter = filters; 
        var parts = key.split('.'); 
        for (var i = 0; i < parts.length; i++) { 
         if (i != parts.length - 1) { 
          filter[parts[i]] = {}; 
          filter = filter[parts[i]]; 
         } 
         else { 
          filter[parts[i]] = val; 
         } 
        } 
       }); 
       // use build-in angular filter 
       var filteredData = params.filter() ? 
         $filter('filter')(data, filters) : 
         data; 
       var orderedData = params.sorting() ? 
         $filter('orderBy')(filteredData, params.orderBy()) : 
         data; 
       params.total(orderedData.length); // set total for recalc pagination 
       $defer.resolve(orderedData.slice((params.page() - 1) * params.count(), params.page() * params.count())); 
      } 
     }); 


     } 
    } 

    return factoryDefinition; 
    } 
]); 

我的分頁包含「頁面級」選擇器和「行/頁面」選擇器。

我應該如何鏈接,這樣,未示出2,3,4頁相同的序列號..這樣的序列號數到分頁...

回答

1

找到了解決辦法,最後。

我發現,在APP.js:

$defer.resolve(orderedData.slice((params.page() - 1) * params.count(), params.page() * params.count())); 

發回的分頁選擇以及頁面大小的頁面數的計數。

因此在指令中添加了兩個範圍變量$scope.pageNumber$scope.itemsPerPage

//Datatable 
    myApp.factory('dataTable', ['$filter', 'ngTableParams', function($filter, ngTableParams) { 

     var factoryDefinition = { 
      render: function($scope, config, componentId, data) { 
      ............................................ 
............................................................... 
.............................................................. 
        $defer.resolve(orderedData.slice((params.page() - 1) * params.count(), params.page() * params.count())); 
        $scope.pageNumber = params.page(); 
        $scope.itemsPerPage = params.count(); 
       } 
      }); 
         } 
     } 
     return factoryDefinition; 
     } 
    ]); 

現在在HTML中,我進行了計算以查找索引號。我用<td data-title="'#'">{{ (itemsPerPage * (pageNumber-1)) + $index+1 }}</td>替換了<td data-title="'#'">{{$index + 1}}</td>,這是我的問題的解決方案!

+0

很酷你自己找到了! –

相關問題