当前位置: 首页 > 面试题库 >

如何在AngularJS的过滤器中使用参数?

濮阳默
2023-03-14
问题内容

当我用ng-repeat迭代一些数组时,我想在过滤器中使用参数

例:

HTML部分:

<tr ng-repeat="user in users | filter:isActive">

JavaScript部分:

$scope.isActive = function(user) {
    return user.active === "1";
};

但是我希望能够使用像

<tr ng-repeat="user in users | filter:isStatus('4')">

但是它不起作用。我该怎么做?


问题答案:

更新:
我想我对文档的了解并不足够,但是您绝对可以使用具有以下语法的过滤器过滤器(请参阅此小提琴)来按对象的属性过滤:

<tr ng-repeat="user in users | filter:{status:4}">

如果有帮助,这是我的原始答案:

使用过滤器过滤器将无法传递参数,但是至少可以做两件事。

1)在范围变量中设置要过滤的数据,并在您的过滤函数中引用该数据,例如 fiddle。

JavaScript:

$scope.status = 1;
$scope.users = [{name: 'first user', status: 1},
                {name: 'second user', status: 2},
                {name: 'third user', status: 3}];

$scope.isStatus = function(user){
    return (user.status == $scope.status);
};

HTML:

<li ng-repeat="user in users | filter:isStatus">

要么

2)创建一个新的过滤器,该过滤器接受一个类似 fiddle的参数。

JavaScript:

var myApp = angular.module('myApp', []);
myApp.filter('isStatus', function() {
  return function(input, status) {
    var out = [];
      for (var i = 0; i < input.length; i++){
          if(input[i].status == status)
              out.push(input[i]);
      }      
    return out;
  };
});

HTML:

<li ng-repeat="user in users | isStatus:3">

请注意,此过滤器假定status数组中的对象中有一个属性,这可能会使它的可重用性降低,但这只是一个示例。您可以阅读此内容以获取有关创建过滤器的更多信息。



 类似资料:
  • 问题内容: 我想在过滤器中向后端请求并返回请求的结果。问题是服务$ http返回一个承诺,这就是问题。 对于存在的问题,我用$超时和角度在我的小提琴的承诺: 我的小提琴 在我的过滤器中,我使用带有承诺的$ timeout,但是最终目标是使用请求http: }); 然后在我看来,我使用了我的过滤器,该过滤器假定以2秒的延迟显示“ ca marche”,但这不起作用: 您会看到过滤器不返回任何内容,并

  • 本文向大家介绍AngularJS中的过滤器使用详解,包括了AngularJS中的过滤器使用详解的使用技巧和注意事项,需要的朋友参考一下 过滤器是用来更改修改数据,并且可以在表达式或使用管道符指令将其归入。以下是常用的过滤器的列表。  小写过滤器 添加小写的过滤器,使用管道符的表达式。在这里添加小写过滤器,以小写字母打印学生姓名。 货币滤波器 加币过滤器使用管道符返回数的表达式。在这里,我们添加了过

  • 本文向大家介绍Angularjs中如何使用filterFilter函数过滤,包括了Angularjs中如何使用filterFilter函数过滤的使用技巧和注意事项,需要的朋友参考一下 AngularJS的filter,中文名“过滤器”是用来过滤变量的值,或者格式化输出,得到自己所期望的结果或格式的东东。AngularJS中有一个filterFilter函数用来对集合过滤,非常方便。 源代码大致如下

  • 过滤器可用在任何api或者ng.$rootScoe.Scope的执行过程中,不过一般用来格式化绑定在模板中的表达式。 \{\{ expression | filter \}\} 过滤器一般在处理过程中将数据转变成新的格式。它能使用链式风格,还能接受附加参数。 你可以像下面这样使用链式风格: \{\{ expression | filter1 | filter2 \}\} 你也可以使用“:”来传

  • 下面的代码被修改为不包括我的数据库中的任何数据。 然后将其传递到initialize方法中,在该方法中进行表的实际填充。 顺便说一下,Users类如下所示: 该程序按预期工作,我可以看到与图像和VBox的详细信息的表格。 现在我想添加一个TextField来过滤表,过滤参数是标签中的文本。 我明白了,我需要将ObservableList放入FilteredList中,然后放入SortedList中

  • 问题内容: 我的过滤器很少 在我的项目中,要获得良好的结果,我必须在控制器中进行此过滤,而不是在视图中 我知道基本的语法,但我不知道如何在控制器中制作过滤器链,因此一切都将如模板中的示例一样工作。 我找到了一些解决方案,现在仅使用一个过滤器,但是应该可以用于许多;) 我在ng-repeat中使用此功能可以正常工作,但是我必须使用少量过滤器进行检查。 问题答案: 您只需重新过滤您从第一个过滤器返回的