ngTable 날짜 (밀리 초) 데이터 정렬 및 필터링 방법?

Question

Angularjs는 테이블 열에 대한 필터뿐만 아니라 내림차순으로 밀리 초 단위로 날짜 정렬에 도움이 필요합니다. plunker here을 만들었지 만 일부 필터 매개 변수를 입력하면 필터링 된 데이터가 표시되지 않고 데이터가 테이블에서 손실됩니다.

날짜 열을 정렬하고 대소 문자를 구분하지 않는 필터 검색을 도와주세요. 아래 코드를 제공하고 있습니다.

<table ng-table="tableParams" show-filter="true" class="table" > 
    <tr ng-repeat="item in $data" height="10px"> 
    <td data-title="'Date'" filter="{ 'item[0]': 'date' }" sortable="'item[0]'">{{translate(item[0])}}</td> 
    <td data-title="'Count'" filter="{ 'item[1]': 'text' }" sortable="'item[1]'">{{item[1]}}</td> 
    </tr> 
</table> 

$scope.translate = function(value) { 
    if (value == null || value == undefined) 
     return value; 
    var monthNames = [ "Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec" ]; 
    var myDate = new Date(value); 
    return myDate.getDate() + " " + monthNames[myDate.getMonth()] + " "+myDate.getFullYear(); 
} 
$scope.tableParams = new ngTableParams({ 
    page: 1,   // show first page 
    count: 10   // count per page   
}, { 
    total: $scope.tasksRunDataForTable.length, // length of data 
    getData: function($defer, params) { 
     // use build-in angular filter 
     var sortedData = params.sorting() ? 
          $filter('orderBy')($scope.tasksRunDataForTable, params.orderBy()) : 
          $scope.tasksRunDataForTable; 
     var orderedData = params.filter() ? 
       $filter('filter')(sortedData, params.filter()) : 
       sortedData; 
     params.total(orderedData.length); // set total for recalc pagination 
     $defer.resolve(orderedData.slice((params.page() - 1) * params.count(), params.page() * params.count())); 
    } 
}); 

내가 계산에 필터 작업을 얻을 수 있어요

업데이트,하지만 날짜와 행운 모두 열을 정렬. Updated plunker

<td data-title="'Count'" filter="{ '1': 'text' }" sortable="'1'">{{item[1]}}</td> 

Answer 1

일이이 ngTable의 문제하지만 어떻게 '있는 OrderBy'작업을위한 기본 각도 필터없는

정렬.

각각 valueOf()[0], valueOf()[1]을 사용하십시오. 여기서 &1은 내부 배열의 색인입니다. 여기에 html이 있으며 getData 콜백을 변경할 필요가 없습니다.

<table ng-table="tableParams" show-filter="true" class="table" > 
    <tr ng-repeat="item in $data" height="10px"> 
     <td data-title="'Date'" filter="{ '0': 'text' }" sortable="valueOf()[0]">{{ item[0] | date: 'd MMM yyyy HH:mm' }}</td> 
     <td data-title="'Count'" filter="{ '1': 'text' }" sortable="valueOf()[1]">{{ item[1] }}</td> 
    </tr> 
</table> 

이가 다른 각도 필터 '날짜'에 의해 지원됩니다 당신은 밀리 초에서 날짜를 제시 통역 필요는 없습니다. 당신은 세 번째 인수 때와 같이 사용자 정의 " comperator"기능을 사용할 필요가 날로부터 필터링을 달성하기 위해

(문자열에서)

참조이 어떻게 든 관련 포스트 https://stackoverflow.com/a/15858739/61577

날짜 필터링 컨트롤러에서 필터링. 이런 식으로 뭔가 트릭 컨트롤러 GetData의 콜백에 다음

var dateComperator = function(obj, text) { 
    var valueAsText = obj + ''; 
    if (valueAsText.length == 13) { // must be milliseconds. 
     valueAsText = $filter('date')(obj, 'd MMM yyyy HH:mm'); 
    } 
    return !text || (obj && valueAsText.toLowerCase().indexOf(text.toLowerCase()) > -1); 
}; 

을 수행합니다

getData: function($defer, params) { 
     // use build-in angular filter 
     var sortedData = params.sorting() ? 
          $filter('orderBy')($scope.tasksRunDataForTable, params.orderBy()) : 
          $scope.tasksRunDataForTable; 
     var filterInfo = params.filter(); 
     var comparer = (filterInfo && filterInfo['0']) ? dateComparer : undefined; 
     $log.log(angular.toJson(filterInfo)) 
     var orderedData = filterInfo ? 
       $filter('filter')(sortedData, filterInfo, comparer) : 
       sortedData; 
     params.total(orderedData.length); // set total for recalc pagination 
     $defer.resolve(orderedData.slice((params.page() - 1) * params.count(), params.page() * params.count())); 
    } 

UPDATE : 필터링 문제를 해결하기위한 답을 업데이트했습니다. 업데이트 2 : 날짜와 횟수를 모두 검색 할 때 태클에 대한 답변이 업데이트되었습니다.

여기에 전체 plunker http://plnkr.co/edit/D2n7MdAfugXpKeKOGosL?p=preview

희망이 도움이됩니다.

Answer 2

내 솔루션 :

 $scope.tableParams = new ngTableParams({ 
     page: 1,   // show first page 
     count: STATIC_CONST.COUNT_PAGAING,   // count per page IMPORTANT 
     sorting: { Id: "desc" } 

    }, { 
     total: data.length, // length of data 
     paginationMaxBlocks: 13, 
     paginationMinBlocks: 2, 
     getData: function ($defer, params) { 

      var filters = angular.copy(params.filter()); 
      //var filters = params.filter(); 
      var filteredData = data; 

      //Custom filters: 
      if (typeof filters['LastUpdateDate'] !== 'undefined') { 
       filteredData = $filter('filterByUI')(filteredData, 'LastUpdateDate', filters['LastUpdateDate'], $filter('date'), ['dd.MM.yyyy']); 
       delete filters['LastUpdateDate']; 
      } 

      //General filters: 
      if (filters) { 
       // use build-in angular filter 
       filteredData = $filter('filter')(filteredData, filters); 
      } 


      //if (filters.FromDate) { 
      // filteredData = $filter('filterDates')(data, filters.FromDate); 
      //} 

      var orderedData = params.sorting() ? 
       $filter('orderBy')(filteredData, params.orderBy()) : 
       filteredData; 


      params.total(orderedData.length); // set total for recalc pagination 
      $defer.resolve(orderedData.slice((params.page() - 1) * params.count(), params.page() * params.count())); 
     } 
    }); 

Layout.html :

<table ng-table="tableParams" show-filter="true" class="table" > 
<tr ng-repeat="item in $data" height="10px"> 
    <td data-title="'Date'" filter="{ 'LastUpdateDate': 'text' }" sortable="valueOf()[0]">{{ item[0] | date: 'd MMM yyyy HH:mm' }}</td> 
    <td data-title="'Count'" filter="{ '1': 'text' }" sortable="valueOf()[1]">{{ item[1] }}</td> 
</tr> 

\ APPS \ app.module.js :

app.filter("filterByUI", function() { 

    debugger; 

    return function (arrayData, dateKey, dateValue, filterFunction, filterFunctionParams) { 
     var returnarr = []; 
     returnarr = arrayData.filter(function (element) { 
      var evalCode = "filterFunction(element." +dateKey; 
      filterFunctionParams.forEach(function (element, index, array) { 
       evalCode += ", filterFunctionParams["+index+"]"; 
      }); 
      evalCode += ")"; 

      try{ 
       var dudi86 = eval(evalCode); 

       if(typeof dudi86 === 'number') { 
        dudi86 = dudi86.toString(); 
       } 

       if(typeof dudi86 === 'string') { 
        return dudi86.toLowerCase().indexOf(dateValue.toString().toLowerCase()) > -1; 
       } 

       if(Array.isArray(dudi86)) { 
        if(Array.isArray(dateValue)) { 
         return dateValue.every(function(val) { return dudi86.indexOf(val) >= 0; }); 
        } 

        if(typeof dateValue === 'string' || typeof dateValue === 'number') { 
         //TODO: Consider this case: 
         return dudi86.indexOf(dateValue.toString().toLowerCase()) > -1; 
        } 
       } 



      }catch(e){ 
       console.log("app.filterByUI: Error on evaluating: " +evalCode); 
      } 


      return false; 

     }); 

     return returnarr; 

    } 
});