角度検索複数の入力値

Question

結果セットにng-repeatを設定しました。今私は一種のフィルタリングを行う必要があります。検索結果をフィルタリングするためにng-filterを使ってみました。 ユースケース：ユーザーは、それぞれカンマ区切り（または他のpreferered machanism）の複数のmerchantIdsを入力できます。入力された結果セットは、ユーザーが入力したmerchantIdsに対応します。 現在の動作：単一のmerchantIdを検索すると検索がうまくいきます。 たとえば、ユーザーがmerchantIdと入力すると、merchantIdで始まるすべてのマーチャントが表示されます。入力値がmerchantId_1の場合、結果はmerchantId_1にのみ関連します。私が必要とするのは、ユーザが入力する能力を与えられるべきであるということです。merchantId_1、merchantId_2（それぞれコンマが区切られています）。結果は両方のmerchantIdsに対応します。

角度を使用してこれを実現する実現可能な方法は何ですか。

Answer 1

私は、あなたが目指していたことを実現するプランナーを作った。

https://plnkr.co/edit/T9Z6GCFHzwH9xCKxkxJ7?p=preview

HTML：

<input ng-model="searchText" /> 
<div ng-repeat="merchant in merchants | merchantFilter:searchText"> 
    {{merchant}} 
</div> 

JS：

angular.module('app', []) 
.controller('testController', function($scope) { 
    $scope.merchants = ['merchant_1', 'merchant_2', 'merchant_3'] 
}) 
.filter('merchantFilter', function() { 
    return function(merchants, searchText) { 
    // If there's no input, return full list 
    if (!searchText) return merchants; 
    // Split and trim the search string 
    var searchTerms = searchText.split(','); 
    searchTerms = searchTerms.map(function(term) { 
     return term.trim(); 
    }) 
    // Filter and return merchants matching any search term 
    var returnedArray = []; 
    _.forEach(merchants, function(merchant) { 
     if (_.find(searchTerms, function(term) { 
     return merchant.indexOf(term) > -1; 
     })) { 
     returnedArray.push(merchant) 
     } 
    }) 
    return returnedArray; 
    } 
});