Javascript AngularJS ng网格过滤器--过滤器文本格式

我正在使用AngularJS ng网格（v2.0.7 v2.0.8），我想了解API中filterText字段的语法

特别是，我想知道如何筛选特定列，以及如何筛选列中的一个或多个条目

---

有许多带有标记ng grid和filter的堆栈溢出问题，虽然它们很有用，但目前还没有提供filterText格式的完整摘要

在撰写本文时，没有关于如何构造“filterText”字符串的总结。在研究了ng-grid.js代码并进行了一些猜测之后，我发现“filterText”比当前的文档所建议的功能更强大，表达能力更强

示例设置

为了建立答案，首先考虑一个具有以下定义的网格，它位于某个控制器：

$scope.pricing_data=data['records'；
$scope.gridOptions={
数据：“定价数据”，
columnDefs：[
{字段：'ticker'，显示名称：'ticker'}，
{字段：'date'，显示名称：'date'}，
{字段：'close'，显示名称：'close'}，
{字段：“卷”，显示名称：“卷”}
],
filterOptions:{filterText:''，useExternalFilter:false}，
showFilter：正确
};

data['records']处的对象可以是从后端发送的某个json对象。示例表可能如下所示：

目前，filterText为空，因此显示所有记录

网格右上角的向下胡萝卜可见，因为showFilter为true。单击向下箭头显示绑定到变量“filterText”的输入。在本次讨论中，我将使用此下拉列表显示一些结果，但通常可以在控制器代码中直接分配给filterText。下拉列表如下所示：

搜索网格中的所有字段 默认情况下，filterText对网格中的每个单元格执行正则表达式。键入字符“a”将选择在该记录的任何条目（或列）中包含字符“a”的所有记录。键入“ab”将选择在该记录的任何条目中具有字符序列“ab”的所有记录。根据您的需求，此行为可能非常适合。但是，对于大型数据集，由于数据的性质（例如选择价格报价器）以及搜索整个网格的高成本，通常需要对列而不是整个网格进行过滤

按列搜索 为了仅在一列上搜索字符串或正则表达式，filterText语法为：

filterText = '<displayName>:<literal>'

filterText = '<displayName 1>:<lit 1>[|<lit 2>|..];<displayName 2>:<lit a>[|<lit b>|..][;..]'

filterText='：'

比如说,

这里，displayName“Date”（不使用字段值，必须使用displayName）后跟冒号“：”，然后是部分字符串。结果是只选择了三条记录，即与10月30日相关的记录

让我们展开搜索。要搜索10月30日或10月31日，语法为

filterText = '<displayName>:<literal 1>|<literal 2>|...'

filterText='：| |……'

其中管道“|”将每个部分管柱分隔开。你可以把任意数量的链子连在一起。多日期筛选器可能如下所示：

显然，选择的性质是或。然而，我的例子并不好，因为股票代码和日期有不相交的字符。因此，您可以相信我，只搜索日期列，或者设置您自己的示例。（或者，更好的方法是阅读ng grid中的buildSearchConditions（）函数，这一点非常清楚）

在多个列中搜索条目 搜索多列只需要在一列中搜索的语法扩展。此语法是：

filterText = '<displayName>:<literal>'

filterText = '<displayName 1>:<lit 1>[|<lit 2>|..];<displayName 2>:<lit a>[|<lit b>|..][;..]'

filterText=”：[| |…]：[||..][;..]'

有效的词汇元素是分号“；”分隔每个列displayName的

继续这个例子，让我们在10月30日或31日搜索nyt或nvda。这看起来像：

从逻辑上讲，过滤器搜索（沿纽约时报或nvda的股票代码）和（沿日期搜索10-30或10-31）

网格更新 我不太熟悉来自单元格编辑的更新。我想结果是一样的

当angular js控制器与后端一起工作时，更新网格数据，然后更新的数据被推送到过滤器中。这是一个很好的结果，实际上过滤器仍然存在

已知错误-清除

---

在撰写本文时，有一个已知错误的最新修复，清除filterText几乎或确实会挂起浏览器。我关注的报告是这样的：。下面合并了一个修复程序。我可以肯定地确认，当清除应用于大型数据集的筛选器时，我发现性能很差。我还没有测试修复程序

更新

我刚开始安装ng grid 2.0.8。显而易见的问题已经解决了。效果很好

---

ng网格3.0

---

ng grid 3.0现在已在绘图板上。ng grid 2.0中已经有很多优点，但就像任何真正新的代码一样，一些重写也会有所帮助。我鼓励ng网格开发人员保留他们已经包含的过滤器特性，并可能扩展性能或范围

根据JayInNyc的回答，我做了一些事情，让用户更容易使用，而不是遵循语法。我基本上看任何我想过滤的字段。在本例中，我有一个名称和城市的输入字段

$scope.filterOptions = {
    filterText: ''
};
$scope.filterName = '';
$scope.filterCity = '';

$scope.$watch('filterName', function (value) {

    setFilterText();
});

$scope.$watch('filterCity', function (value) {

    setFilterText();
});

function setFilterText()
{
    $scope.filterOptions.filterText = 'Name: ' + $scope.filterName + ';City:' + $scope.filterCity;
}

顺便说一句，我想使用compile函数，但它似乎不起作用。我有以下几项，但它不起作用

---

filterOptions.filterText=$compile（'Name:{{filterName}；Category:{{filterCategory}}'）（范围）
一个极好的答案-我希望它在ngGrid Wiki中，它解决了一个难题。我的用户需要搜索包含冒号“：”字符的字符串，这些字符在我的网格数据集中很常见。通过修改用户的搜索字符串，使“：”和“；”替换为转义的等效值