【问题标题】:AngularJS $filter in controller with or condition for same attribute控制器中的 AngularJS $filter 具有相同属性的或条件
【发布时间】:2016-02-02 13:58:33
【问题描述】:

控制者:

var myApp = angular.module('myApp', []);

myApp.controller('myCtrl', ['$scope', '$filter', function($scope, $filter){

    $scope.tickets = [
                      {title : 'ticket1', assignee : {id:'pratap', name: 'PRATAP'}},
                      {title : 'ticket2', assignee : null},
                      {title : 'ticket3', assignee : {id:'ak', name: 'AK'}}
                      ];    

    $scope.defaultOption = 1;
    $scope.options = [
                      {id:1, name : 'MY TICKETS'},
                      {id:2, name : 'OTHERS TICKET'}
                      ];

    $scope.filteredTicket = [];

    $scope.filterData = function(criteria) {
        if (criteria == 1) {
            $scope.filteredTicket = $filter('filter')($scope.tickets, {assignee: {id:'pratap'}});
        } else {
            $scope.filteredTicket = $filter('filter')($scope.tickets, {assignee: null, assignee: {id:'ak'}});
            console.log($scope.filteredTicket);
        }


    };

    $scope.filterData($scope.defaultOption);

}]);

HTML:

<div ng-controller="myCtrl">
<div>Current User: pratap</div>
<div>
    FILTER: <select ng-model="defaultOption" ng-change="filterData(defaultOption)" ng-options="option.id as option.name for option in options"></select>
</div>
    <div>
        <h1>Tickets</h1>
        <ul>
            <li ng-repeat="ticket in filteredTicket">{{ticket.title}}</li>
        </ul>
    </div>  
</div>  

我想知道是否可以在 $filter 中使用相同的对象属性来形成或条件,如下所示

$scope.filteredTicket = $filter('filter')($scope.tickets, {assignee: null, assignee: {id:'ak'}});

这样我就得到了具有受让人:null 和受让人:'ak' 的对象。如果我选择 OTHERS TICKETS 我需要显示ticket2 和ticket3,但到目前为止我只得到ticket3。

有人可以帮忙吗?

Created-Plunker-Here

【问题讨论】:

  • 同一个对象中不能有两个相同的参数;你需要重写你的过滤器来寻找一组受让人条件:{assignee: [null,{id: 'ak'}]}
  • 如果我这样做,我会得到一个空数组作为回报
  • {assignee: foo, assignee: bar} 不是一个有效的结构,这就是我的意思:冗余参数将相互覆盖。

标签: angularjs angularjs-filter


【解决方案1】:

您可以在过滤器的表达式中添加一个函数:

$scope.filteredTicket = $filter('filter')($scope.tickets, function(value){
        return value.assignee === null || value.assignee.id === 'ak';
});

Plunkr

【讨论】:

【解决方案2】:

只需使用Array.prototype.filter 方法手动过滤它,您就有更大的灵活性:

$scope.filterData = function(criteria) {
  if (criteria == 1) {
    $scope.filteredTicket = $scope.tickets.filter(function(ticket) {
      return ticket.assignee === null || ticket.assignee.id == 'pratap';
    });
  } 
  else {
    $scope.filteredTicket = $scope.tickets.filter(function(ticket) {
      return ticket.assignee === null || ticket.assignee.id == 'ak';
    });
    console.log($scope.filteredTicket);
  }
};

演示: https://plnkr.co/edit/MyYfkKzYdJmdAeFHYEvw?p=preview

【讨论】:

  • 谢谢!!有用。我只是想知道如何在同一个对象中拥有“两个相同的参数”,任何想法?
  • 你用数组来做。
【解决方案3】:

看看这个

var rateSelected = $filter('filter')($scope.GradeList, function (obj) {
                        if(obj.GradeId == $scope.contractor_emp.save_modal_data.GradeId)
                        return obj;
                });

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2020-03-13
    • 2013-02-25
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2017-04-29
    • 2015-03-12
    • 2016-04-04
    相关资源
    最近更新 更多