I have 2 dropdowns one for fields like 'id' , 'name' etc and one for filters like 'uppercase' , 'contains' , 'endWith' etc. Filters value are custom filters name written in angularjs.I have one search textbox where the user types the search item for selected field and property.
<div>
<label>Filter</label>
<select ng-model="selectedFilter">
<option value="uppercase">Uppercase</option>
<option value="startsWithLetter">Starts With</option>
</select>
</div>
<div>
<label>Fields</label>
<select ng-model="selectedField">
<option value="Id">Id</option>
<option value="name">startsWithLetter</option>
</select>
</div>
<input type="text" ng-model="search"/>
Now I have writtern a general implementation to fire filter like this
app.filter('picker', function ($filter) {
return function (value, filterName) {
return $filter(filterName)(value);
};
});
and few custom filters like this
app.filter('startsWithLetter', function () {
return function (items, letter) {
var filtered = [];
var letterMatch = new RegExp(letter, 'i');
for (var i = 0; i < items.length; i++) {
var item = items[i];
if (letterMatch.test(item.name.substring(0,1))) {
filtered.push(item);
}
}
return filtered;
};
});
here is the $scope model
$scope.friends = [
{
id: 1,
name: 'Andrew'
},
{
id: 2,
name: 'Will'
},
{
id: 3,
name: 'Mark'
},
{
id: 4,
name: 'Alice'
},
{
id: 5,
name: 'Todd'
}];
I am struggling with a syntax to write in ng-repeat so that filter apply only on that property selected and the selected filter with that search term . if nothing selected then table will show regular data.
<ul>
<li ng-repeat="friend in friends | filter:{syntax }">
{{ friend.id}} , {{ friend.name }}
</li>
</ul>
I am implementing this feature. Need help?
