Question

这就是我所做的

<div ng-app="myApp" ng-controller="PeopleCtrl">     
<table border="1" ng-init="ageToShow=(people| underTwenty: 20).length >= 1">

我的underTwenty功能如下

myApp.filter('underTwenty', function() {

  return function(values, limit) {
    var returnValue = [];
    angular.forEach(values, function(val, ind) {
      if (val.age < limit)

        returnValue.push(val);
        });
  return returnValue;
  };

我想在我的视图中将 returnValue 数组显示为这样的表达式

<div ng-app="myApp" ng-controller="PeopleCtrl">     
    <table border="1" ng-init="ageToShow=(people| underTwenty: 20).length >= 1">
{{ageToShow}}

我知道这不是正确的方法，但它是什么......请帮助...

Plunker ：http://plnkr.co/edit/ceeF5tXFlBqInW5J3bdq?p=preview

Answer 1

在控制器中添加新的过滤功能：

$scope.criteriaMatch = function( criteria ) {
  return function( person ) {
    return person.age  < criteria;
  };

在视野中改为：

<tr ng-repeat="person in people| filter:criteriaMatch(20)"  >

表格显示2行年龄少于20

http://plnkr.co/edit/PonnLcvrjEEHhceSqD0g?p=preview

Answer 2

在ng-repeat中，管道多个过滤器以根据年龄过滤人员。

  <tr ng-repeat="person in people| filter: search | underTwenty: 20"  >

我更喜欢您单独保留过滤器而不是控制器的方法，因为如果需要，您也可以在其他视图中重用该过滤器。否则，您可能需要将该代码粘贴到多个控制器中。

但是保持登录视图是一个坏主意。相反，在您的控制器中，您可以创建该变量并进行检查。这将从逻辑中删除演示文稿。

它将成为：

$scope.ageToShow = $filter('underTwenty')($scope.people, 20).length >= 1;

将$ filter注入您的控制器。

<强> DEMO

Answer 3

在代码中更改此行：<tr ng-repeat="person in people| filter: search" >至<tr ng-repeat="person in people| underTwenty: 20" >。因此，该表仅包含年龄小于20的项目。（据我所知，这是您想要的。）

Answer 4

在此处查找更新的代码：

<body>
<div ng-app="myApp" ng-controller="PeopleCtrl">


<table border="1" ng-init="ageToShow=(people| underTwenty: 20).length >= 1">

  {{people| underTwenty: 20}}
<tr>
<th>Id</th>
<th>Name</th>
<th ng-if="!ageToShow">Age</th>
</tr>
<tr ng-repeat="person in people| underTwenty: 20"  >
<td><span>{{person.id}}</span>
</td>
<td><span>{{person.name}}</span>
</td>
<td ng-if="!ageToShow"><span>{{person.age}}</span>
</td>
</tr>
</table>

</div>
</body>
</html>

希望这是你想要的那个

如何从过滤器函数中显示数据/数组以查看内部表达式？

4 个答案: