2017-03-08 5 views
2

하나의 열에 대해 UI - Grid에 사용자 정의 필터를 만들었습니다. 나는 적용된 필터와 정확히 일치에만 값을 필터링 할과하지에 포함 아래 정확한 일치를 필터링하기 위해 UI 격자의 사용자 정의 필터

사용자 정의 필터에 대한 내 컨트롤러이다.

myapp2.controller('activityFilterCtrl', function($scope, $compile, $timeout) { 
var $elm; 
$scope.showAgeModal = function() { 
    $scope.listOfAges = ['TRL1','TRL2','TRL3','TRL4','TRL5','TRL6','Launch Gate','Alpha Gate','Beta Gate','H-O','Intermediate H-O','Internal Review','DEL','Evaluation','MIL']; 




    $scope.gridOptions = { 
      data: [], 
      enableColumnMenus: false, 
      onRegisterApi: function(gridApi) { 
       $scope.gridApi = gridApi; 

       if ($scope.colFilter && $scope.colFilter.listTerm){ 
        $timeout(function() { 
         $scope.colFilter.listTerm.forEach(function(activityType) { 
          var entities = $scope.gridOptions.data.filter(function(row) { 
           return row.activityType === activityType; 
          }); 

          if(entities.length > 0) { 
           $scope.gridApi.selection.selectRow(entities[0]); 
          } 
         }); 
        }); 
       } 
      } 
    }; 

    $scope.listOfAges.forEach(function(activityType) { 
     $scope.gridOptions.data.push({activityType: activityType}); 
    }); 

    var html = '<div class="modal" ng-style="{display: \'block\'}"><div class="modal-dialog"><div class="modal-content"><div class="modal-header">Filter Ages</div><div class="modal-body"><div id="grid1" ui-grid="gridOptions" ui-grid-selection class="modalGrid"></div></div><div class="modal-footer"><button id="buttonClose" class="btn btn-primary" ng-click="close()">Filter</button></div></div></div></div>'; 
    $elm = angular.element(html); 
    angular.element(document.body).prepend($elm); 

    $compile($elm)($scope); 

}; 

$scope.close = function() { 
    var ages = $scope.gridApi.selection.getSelectedRows(); 
    $scope.colFilter.listTerm; 
    $scope.colFilter.listTerm=[]; 
    ages.forEach(function(activityType) { 
     $scope.colFilter.listTerm.push(activityType.activityType); 
    }); 

    $scope.colFilter.term = $scope.colFilter.listTerm.join(', '); 
    $scope.colFilter.condition = new RegExp($scope.colFilter.listTerm.join('|')); 

    if ($elm) { 
     $elm.remove(); 
    } 
}; 

}) }

이 내 열입니다 해당 열의 정의 :

{ 

            name: "Activity Type", 
            field: 'activityType', 
            visible: false, 
            headerTooltip:'Activity Type', 
            enableHiding: false,cellClass: 'scheduleData', 
            minWidth:150,enableFiltering: true, 
            filterHeaderTemplate: '<div class="ui-grid-filter-container" ng-repeat="colFilter in col.filters"><div activity-filter-model></div></div>', 
            filter: { 
              condition: function(searchTerm, activityType) { 
               return activityType.indexOf(searchTerm) > -1 
              } 

               }, 
           }, 

내가 col.Filter을 적용하는 동안, 컨트롤러에서 정규식을 사용하는 경우 나를 인도 해주십시오 조건 또는 열 def의 필터 조건이 작동하는지 확인하십시오.

답변

1

해결됨 :

맞춤 필터 제어기에 대한 시작 값 설정 :

$ scope.colFilter.condition = 2;

+0

답변을 "수락"으로 표시하는 것을 잊지 마십시오. 고마워, 제발. –