angularjs - Angular 过滤器定义中的 'anyPropertyKey' 是什么?

标签 angularjs

Angular JS

{{ filter_expression | filter : expression : comparator : anyPropertyKey}}

我无法理解最后一个参数,即 anyPropertyKey。任何人都可以用 解释我吗?简单的例子
<div ng-init="ar=[{n:'ram1', m:1}, {n:'mah', m:1}, {n:'vij', m:3}]">
    <div ng-repeat='x in ar | filter: "1": false: propertyName'>{{x}}</div>
</div>

这是我到目前为止所尝试的。在上面的代码中,我应该写什么而不是 propertyName。

最佳答案

anyPropertyKey与过滤器的表达有关。 documentation的相关部分是:

A special property name ($ by default) can be used (e.g. as in {$: "text"}) to accept a match against any property of the object or its nested object properties. That's equivalent to the simple substring match with a string as described above. The special property name can be overwritten, using the anyPropertyKey parameter.



所以这里的第一件事是这个表达式:
<div ng-repeat='x in ar | filter: "1": false'>{{x}}</div>

等价于这个表达式:
<div ng-repeat='x in ar | filter: {$:1}: false'>{{x}}</div>

因此,不是简单的子字符串匹配,而是使用带有特殊键(默认为 $)的对象来匹配具有值 1 的对象的任何属性。 .
anyPropertyKey参数可用于覆盖默认$像这样的属性:
<div ng-repeat='x in ar | filter: {"@":1}: false: "@"'>{{x}}</div>

在最后一个例子中,我们使用 @符号匹配任何属性名称,释放 $用于其他目的。

以下代码段显示了所有三个表达式的相同输出:

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.8/angular.min.js"></script>

<body ng-app="">
<div ng-init="ar=[{n:'ram1', m:1}, {n:'mah', m:1}, {n:'vij', m:3}]">
  <div ng-repeat='x in ar | filter: "1": false'>{{x}}</div>
  <hr />
  <div ng-repeat='x in ar | filter: {$:1}: false'>{{x}}</div>
  <hr />      
  <div ng-repeat='x in ar | filter: {"@":1}: false: "@"'>{{x}}</div>
  <hr />
  </div>

</body>

关于angularjs - Angular 过滤器定义中的 'anyPropertyKey' 是什么?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/38605558/

相关文章:

javascript - 在 AngularJS/bootstrap 中将对象传递到模式对话框

javascript - 带有 chart.js 的 angularjs 中的响应式图表

javascript - 为什么这个索引中的 1 + 1 出现在我的指令中?

javascript - AngularJS/AngularFire - 使用 ng-click 传递对象

angularjs - 我可以将 Angular 应用程序从 Electron 移动到浏览器吗?

javascript - 按小数点对表格单元格进行分组

javascript - 使用 Firebase 3 上传 Base64 图片

javascript - HighCharts - 为只有单个数据点的系列启用标记?

javascript - 对 AngularJS 指令的 Controller 进行单元测试(Karma、Chai、Mocha)

javascript - angularjs http + script7002 : xmlhttprequest: network error 0x80070005, 访问被拒绝