如何在不可见的角度js中应用滤镜?

时间:2022-11-20 18:36:08

I am trying to apply filter in list view .Whenever I typed anything in input field it filter my list .I am able to filter when I write username which is visible to user .example when I write "pa" it sort my list and display only one row .that is correct.but when I write on "keyword filter" which is not visible to user it doesn't filter .In other words when I type "Angular js" on second input field ("keyword filter") ..It should display pab..Because "pab" have Angular js keyword .

我正在尝试在列表视图中应用过滤器。每当我在输入字段中输入任何内容时,它都会过滤我的列表。我能够在我写用户可见的用户名时进行过滤。例如,当我写“pa”时,它会对我的列表进行排序并显示只有一行。这是正确的。但当我写“用户不可见的”关键字过滤器时,它不会过滤。换句话说,当我在第二个输入字段(“关键字过滤器”)上键入“Angular js”时。它应该显示pab..Because“pab”有Angular js关键字。

here is my code http://plnkr.co/edit/TccgJydcZNkXQGpnbbP0?p=preview

这是我的代码http://plnkr.co/edit/TccgJydcZNkXQGpnbbP0?p=preview

// Code goes here

angular.module('myApp', [])
  .controller('myCtrl', function($scope){

  $scope.users = [

    {firstname: 'john', lastname: 'smith',

                keywords: ["HTML", "CSS", "JavaScript", "jQuery", "Photoshop"]

    },
    {firstname: 'pab', lastname: 'due',
             keywords: ["Ruby on Rails", "PostgreSQL", "AngularJS", "Node.js"]

    },
    {firstname: 'bob', lastname: 'rand',            keywords: ["java", "php", "test", "jira"]
}

  ];

});

2 个解决方案

#1


4  

In your ng-repeat you are not filtering after your keyword input - you missed it. Just include it as follows:

在您的ng-repeat中,您没有在关键字输入后进行过滤 - 您错过了它。只需包含如下:

<div ng-repeat="user in users | filter:userSearch | filter:{ keywords: keyword }">

#2


0  

you just need to add the the same ng-model on the second input :

你只需要在第二个输入上添加相同的ng-model:

ng-model="userSearch"

<body ng-controller='myCtrl'>
  <div>
    <div>
      <input type="text" placeholder="username search" ng-model="userSearch">
    </div>
    <br>
    <div>
      <input type="text" placeholder="keyword search" ng-model="userSearch">
    </div>
  </div>

plunker: http://plnkr.co/edit/Nqp45xwrZqPLIWDtjGvQ?p=preview

plunker:http://plnkr.co/edit/Nqp45xwrZqPLIWDtjGvQ?p = preview

hope helps good luck.

希望有助于好运。

#1


4  

In your ng-repeat you are not filtering after your keyword input - you missed it. Just include it as follows:

在您的ng-repeat中,您没有在关键字输入后进行过滤 - 您错过了它。只需包含如下:

<div ng-repeat="user in users | filter:userSearch | filter:{ keywords: keyword }">

#2


0  

you just need to add the the same ng-model on the second input :

你只需要在第二个输入上添加相同的ng-model:

ng-model="userSearch"

<body ng-controller='myCtrl'>
  <div>
    <div>
      <input type="text" placeholder="username search" ng-model="userSearch">
    </div>
    <br>
    <div>
      <input type="text" placeholder="keyword search" ng-model="userSearch">
    </div>
  </div>

plunker: http://plnkr.co/edit/Nqp45xwrZqPLIWDtjGvQ?p=preview

plunker:http://plnkr.co/edit/Nqp45xwrZqPLIWDtjGvQ?p = preview

hope helps good luck.

希望有助于好运。