简体   繁体   English

在Angular JS中过滤由逗号分隔的多个值

[英]Filter multiple values separated by a comma in Angular JS

I have created a filter that searches the view data based on the input value(Single value) entered in the search field. 我创建了一个过滤器,该过滤器根据在搜索字段中输入的输入值(单值)搜索视图数据。

Controller - 控制器-

patchingApp.controller('patchingController', function ($scope, $state, patchingServices, Excel, $timeout) {
    'use strict';

    $scope.searchData   = '';
    $scope.searchForm  = {};

View - 查看-

    <div class="row">
        <div class="col-md-10">
            <span class="search-filter"> On-Screen Filter: <input ng-model="searchText" /></span>
        </div>
    </div>

    <tbody class="tbody-class">
            <tr ng-repeat="patching in main_data_table.message | filter:searchText" >

New Requirement - I should be able to enter multiple values in the search field separated by a comma. 新要求-我应该能够在搜索字段中输入多个值,并用逗号分隔。

Example - {patch, debug} 示例-{补丁,调试}

You can write a custom filter to do this. 您可以编写一个自定义过滤器来执行此操作。 Modify the below code to your requirements 根据您的要求修改以下代码

 var app = angular.module('store', []); app.controller('StoreController', ['$scope', function($scope) { $scope.searchText=""; $scope.friends = [{ name: 'John' }, { name: 'Mary' }, { name: 'Mike' }, { name: 'Adam' }, { name: 'Julie' }, { name: 'Juliette' }]; }]); app.filter('fill', function() { return function(input,val) { if(val!=undefined){ var out=[]; var filterVal = val.split(","); if (filterVal.length > 1) { for (var i = 0; i < filterVal.length; i++) { for(var j=0;j<input.length;j++){ if (input[j].name == filterVal[i]) out.push(input[j]); } } return out; } } } }); 
 <!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Example - example-filter-filter-production</title> <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> </head> <body ng-app="store" ng-controller="StoreController"> <label>Search: <input ng-model="searchText"></label> <table id="searchTextResults"> <tr><th>Name</th></tr> <tr ng-repeat="friend in friends" ng-if="searchText.indexOf(',')==-1"> <td>{{friend.name}}</td> </tr> <tr ng-repeat="friend in friends | fill:searchText track by $index" ng-if="searchText.indexOf(',')>-1"> <td>{{friend.name}}</td> </tr> </table> </body> </html> 

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM