栏目分类:
子分类:
返回
名师互学网用户登录
快速导航关闭
当前搜索
当前分类
子分类
实用工具
热门搜索
名师互学网 > IT > 面试经验 > 面试问答

ngGrid多列过滤

面试问答 更新时间: 发布时间: IT归档 最新发布 模块sitemap 名妆网 法律咨询 聚返吧 英语巴士网 伯小乐 网商动力

ngGrid多列过滤

是的,可以做一个OR过滤器,但是在ng-
grid源代码中搜索后,我看不到如何使用它们进行操作

filterOptions.filterText
。那只能做AND过滤。

解决方案是然后使用

filterOptions.useExternalFilter:true

我也没有找到它的示例,但是经过一番尝试之后,我发现过滤器实际上是通过重新创建

gridOptions.data
对象来完成的。 这是此筛选器的唯一缺点

柱塞代码在这里

因此,基本上,您的代码将类似于以下 index.html

<body ng-controller="MyCtrl">  <strong>Filter Name:</strong> </string><input type="text" ng-model="filterName"/>  </br>  OR  </br>  <strong>Filter Age:</strong> </string><input type="text" ng-model="filterAge"/>  </br>  <button ng-click="activateFilter()">Run Filter</button>  <br/>  <br/>  <div  ng-grid="gridOptions"></div></body>

在你的 controller.js中

app.controller('MyCtrl', function($scope) {$scope.filterOptions = {  filterText: '',  useExternalFilter: true};$scope.activateFilter = function() {  var name = $scope.filterName || null;  var age = ($scope.filterAge) ? $scope.filterAge.toString() : null;  if (!name && !age) name='';  $scope.myData = angular.copy($scope.originalDataSet, []);  $scope.myData = $scope.myData.filter( function(item) {    return (item.name.indexOf(name)>-1 || item.age.toString().indexOf(age) > -1);  }); }; $scope.originalDataSet = [{name: "Moroni", age: 50},    {name: "Tiancum", age: 43},    {name: "Jacob", age: 27},    {name: "Nephi", age: 29},    {name: "Enos", age: 34}]; $scope.myData = angular.copy($scope.originalDataSet, []); $scope.gridOptions = {  data: 'myData',  filterOptions:  $scope.filterOptions };});

那只是基本过滤(使用正则表达式和/或转换为小写字母以实现更好的匹配)。还要注意,如果name和age均为空,则将name设置为”,然后每个元素在过滤器内都将返回true(导致整个数据集返回)。

此选项更适合于 动态 数据集(由 服务器读取 ),但它的工作原理很好,但可以复制原始数据集并对其应用过滤器。



转载请注明:文章转载自 www.mshxw.com
本文地址:https://www.mshxw.com/it/616347.html
我们一直用心在做
关于我们 文章归档 网站地图 联系我们

版权所有 (c)2021-2022 MSHXW.COM

ICP备案号:晋ICP备2021003244-6号