如何通过AngularJS根据选择日期范围过滤网格数据(Ng网格)

时间:2014-11-26 13:46:27

标签: angularjs ng-grid angular-filters

实际上我有一个组合框,其值为“过去七天”,“过去三天”和“今天”,我想根据当前日期选择的值日期范围应用过滤器

2 个答案:

答案 0 :(得分:0)

如果网格的filterOptions对您不起作用,请尝试将完整的数据集保存在一个数组中,将过滤后的集合保存在另一个数组中。将gridOptions.data设置为过滤集。当用户从下拉列表中进行选择时,应用函数将过滤后的集合设置为您想要的任何值。像这样:

  <select ng-model="filterValue"><option value=1>Last 7 days</option></select>

  $scope.allItems = [{someDate:'10/21/14'},{someDate:'11/2/14'},{someDate:'10/24/14'}];
  $scope.filteredItems = [];
  $scope.filterValue;
  $scope.$watch("filterValue", function() {
     // filter your dataset here
     if($scope.filterValue == 1) {   // Last 7 days
         angular.forEach(allItems,function(value) {
             // Use something like moment.js to do date arithmetic
             if(date in last 7 days) {
                   $scope.filteredItems.push(value);
             }
         });
     }

  };

  $scope.gridOptions = { data: 'filteredItems' ....};

答案 1 :(得分:0)

以下是根据问题陈述中所述的组合框中选定的日期选项过滤网格视图数据的解决方案:

这里的durationFilter()是对组合框中值的更改的函数调用

$scope.durationFilter = function () {
            var currentDate = new Date();
            var difDate = new Date();
            $scope.filteredItems = [];

            switch ($scope.selectedItem.id) {
                case 1:
                    $scope.range = 1;
                    break;
                case 2:
                    $scope.range = 3;
                    break;
                case 3:
                    $scope.range = 7;
                    break;
                default:
                    $scope.range = 0;
                    $scope.filteredItems = [{ 0: new Date() }];
                    $scope.gridOptions.filterOptions.filterText = '';
                    break;
            }

            for (var i = 0; i < $scope.range; i++) {
                currentDate.subtractDays(i);
                difDate = currentDate;
                $scope.difDate = $filter('date')(difDate, 'MM/dd/yyyy');
                $scope.filteredItems.push($scope.difDate);
                currentDate = new Date();
            }
            $scope.searchingFilters.filteredDate = $scope.filteredItems;
            $scope.setFilterText();
        };

        $scope.setFilterText = function () {
            $scope.gridOptions.filterOptions.filterText = 'Submit Time:' + $scope.searchingFilters.filteredDate[0] + '|' + $scope.searchingFilters.filteredDate[1] + '|' +
                                                                     $scope.searchingFilters.filteredDate[2] + '|' + $scope.searchingFilters.filteredDate[3] + '|' + $scope.searchingFilters.filteredDate[4] +
                                                                     '|' + $scope.searchingFilters.filteredDate[5] + '|' + $scope.searchingFilters.filteredDate[6] + ';';
        }