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

13 浏览
0 Comments

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

我想在ng-repeat迭代一些数组时使用参数来进行过滤。\n示例：\nHTML部分：\n

\nJavaScript部分：\n

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

\n但我想能够像这样使用过滤器：\n

\n但它不起作用。我该如何做到这样的效果？

0

3 答案

0 Comments

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

在AngularJS中，如果你创建了一个自定义过滤器，你可以向过滤器中传递多个参数。在模板中使用过滤器的用法如下：

{{ 变量 | myFilter:参数1:参数2... }}

如果你在控制器中使用过滤器，可以按以下方式操作：

angular.module('MyModule').controller('MyCtrl',function($scope, $filter){
    $filter('MyFilter')(参数1, 参数2, ...);
})

如果你需要更多的例子和在线演示，可以使用下面的链接：

AngularJs filters examples and demo

0
0 Comments

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

问题出现的原因是用户在过滤器中想要传递参数，但是发现无法正常工作。

解决方法是使用AngularJS的原生过滤器'filter'并传递参数给自定义过滤器。

用户可以按照以下代码编写视图代码：

  • 
    {{user.name}}

  •

    • 然后定义过滤器函数如下：

    $scope.byStatusId = function(statusId) {
    return function(user) {
        return user.status.id == statusId;
    }
}

    这种方法更加灵活，因为可以对嵌套在对象中的值进行比较。

    如果用户想要包含`a`和另一个值，可以像这样请求另一个值：

  •

    • 然后在过滤器中请求另一个值：

    $scope.currentStatus = function(status, otherValue) { ... }

    用户还提到了在使用额外变量时遇到的问题，他们采用了使用`ng-model`和`ng-options`的不同方法来解决问题。

    0
    0 Comments

    在AngularJS中使用过滤器时，有时候需要传递参数，但是使用filter过滤器本身并不能直接传递参数，以下是两种解决方法：

    1）将要过滤的数据设置为作用域变量，并在过滤函数中引用该变量，可以通过以下方式实现：

    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:

  •

    • 2）创建一个带有参数的新过滤器，可以通过以下方式实现：

    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:

  •

    • 需要注意的是，第二种方法中的过滤器假设数组中的对象具有status属性，这可能会导致过滤器的可重用性降低。以上只是示例，可以阅读相关文档以了解更多关于创建过滤器的信息。

    对于第二种方法，还可以传递多个参数给自定义过滤器，甚至可以在模板中传递。如果想要同时过滤"name"和"status"两个属性，可以使用类似"filter:{status:4, name:Mark}"的语法进行过滤。

    以上是对问题"How to use parameters within the filter in AngularJS?"出现的原因和解决方法的整理。

    0