如何根据ng-grid中的精确过滤值进行过滤?

时间:2014-12-08 05:45:43

标签: angularjs ng-grid

我是angularjs的新手,我正在尝试开发一个简单的ng-grid,其中即将出现的数据需要在显示之前进行过滤,所以我正在尝试我尝试过滤但它没有给我精确的过滤器如果过滤值为' / xyz /'然后它给了我' / xyz / asd'但我只需要' / xyz /'值。 ' / XYZ /'是文件夹路径 在我做错的地方,任何人都可以帮助我。

app.controller('DeatilCtrl', function($scope, $http) {
  $scope.totalServerItems = 0;
  $scope.pagingOptions = {
      pageSizes: [15, 20, 30],
      pageSize: 15,
      currentPage: 1
  };    

  $scope.filterByPath ={
          filterText : '/xyz/' 
  };
  $scope.setPagingData = function(data, page, pageSize){    
      var pagedData = data.slice((page - 1) * pageSize, page * pageSize);
      $scope.myData = pagedData;
      $scope.totalServerItems = data.length;
      if (!$scope.$$phase) {
          $scope.$apply();
      }
  };         
  $scope.getPagedDataAsync = function (pageSize, page, searchText,folderPath) {

      setTimeout(function () {
          var data;
          var fPath = folderPath;
          if(fPath == null){
              fPath ='/';
          }
          if (searchText) {
              var ft = searchText.toLowerCase();
              $http.get('rest/files').success(function (largeLoad) {        
                  data = largeLoad.filter(function(item) {
                      return JSON.stringify(item).toLowerCase().indexOf(ft) != -1;
                  });
                  $scope.setPagingData(data,page,pageSize);
              });            
          } else {
              $http.get('rest/files').success(function (largeLoad) {
                  $scope.setPagingData(largeLoad,page,pageSize);
              });
          }
      }, 100);
  };

  $scope.getPagedDataAsync($scope.pagingOptions.pageSize, $scope.pagingOptions.currentPage);

  $scope.$watch('pagingOptions', function (newVal, oldVal) {
      if (newVal !== oldVal && newVal.currentPage !== oldVal.currentPage) {
        $scope.getPagedDataAsync($scope.pagingOptions.pageSize, $scope.pagingOptions.currentPage, $scope.filterOptions.filterText);
      }
  }, true);
  $scope.$watch('filterOptions', function (newVal, oldVal) {
      if (newVal !== oldVal) {
        $scope.getPagedDataAsync($scope.pagingOptions.pageSize, $scope.pagingOptions.currentPage, $scope.filterOptions.filterText);
      }
  }, true);

  var rowTempl = '<div ng-dblClick="onDblClickRow(row)" ng-style="{ \'cursor\': row.cursor   }" ng-repeat="col in renderedColumns" '+'ng-class="col.colIndex()" class="ngCell{{col.cellClass}}"><div ng-cell></div></div>';

  $scope.onDblClickRow = function(row){
      var rowData =  $scope.myData[row.rowIndex];
      var folderpath= rowData.folderPath+rowData.fileName+"/";

     $scope.getPagedDataAsync(folderpath);

  };
  $scope.gridOptions = {
      data: 'myData',

      columnDefs: [
                   { field: "fileName", displayName: "File Name"},
                   { field: "folderPath", displayName: "Full Path"}
               ],
      enablePaging: true,
        showFooter: true,
      totalServerItems: 'totalServerItems',
      pagingOptions: $scope.pagingOptions,
      filterOptions: $scope.filterByPath,
      rowTemplate: rowTempl,

  };
});

休息给出的示例数据:

[ {
  "fileName" : "filename1",
  "folderPath" : "/xyz/"
}, {

  "fileName" : "filename2",
  "folderPath" : "/xyz/"
}, {
  "fileName" : "filename3",
  "folderPath" : "/xyz/abc/"
}, {
  "fileName" : "Resources",
  "folderPath" : "/xyz/pqr/"
}]

1 个答案:

答案 0 :(得分:0)

@Prashant尝试这样的事情:

  $http.get('rest/files').success(function (largeLoad) {
                  var fp =[];
                  for (var i = 0; i < largeLoad.length; i++) {
                      if (largeLoad[i].folderPath === '/xyz/') {
                        fp.push(largeLoad[i]);
                      }
                 $scope.setPagingData(fp,page,pageSize);
                  }
              });