Estoy tratando de filtrar una sola columna usando una selección con múltiples opciones. Tan pronto como selecciono más de 2 opciones, el filtro se rompe y me devuelve 0 resultados cuando espero devolver las opciones que seleccioné.
Por ejemplo, si selecciono Apple y Grape, debería ver todos los elementos que coinciden con mis opciones.
Aquí un ejemplo de mis datos:
$scope.products = [ {name:"Apple",type:"fruit"}, {name:"Grape",type:"fruit"}, {name:"Orage",type:"fruit"}, {name:"Carrot",type:"vegetable"}, {name:"Milk",type:"dairy"} ]Aquí está mi HTML
<div ng-controller="MyCtrl"> <select multiple ng-model="Search_by_name"> <option value="Apple">Apple</option> <option value="Grape">Grape</option> <option value="Orage">Orage</option> <option value="Carrot">Carrot</option> <option value="Milk">Milk</option> </select> <ul> <li ng-repeat="item in products | filter:{name: Search_by_name }">{{item.name}}</li> </ul> </div>He estado buscando en Google durante 2 horas y no puedo seguir pensando en esto. ¿Alguien tiene alguna idea?
Puede crear una función de filtro personalizada en el controlador:
$scope.multipleFilter = function(filterCriteria) { return function(item) { return (!filterCriteria || filterCriteria.indexOf(item.name) > -1 ); } };En el html puedes usarlo así.
<li ng-repeat="item in products | filter: multipleFilter(Search_by_name)">{{item.name}}</li>