I've encountered an issue with a custom filter I'm currently working on. The challenge lies in the fact that I'm using Angular 1.3.6 and am unable to upgrade at the moment. Therefore, I truly need your assistance with this matter.
When you type 1H, the filter successfully displays all the leagues with those characters, which is great. However, if you type something like College, it only shows sports starting with College and hides the leagues under those sports. My filter works well for leagues, but not when trying to search for specific sports. I want the filter to show all sports along with their respective leagues when searching through sports.
It's important for me to maintain the current behavior when filtering leagues, as it works perfectly. The problem arises when searching for sports. Below is a snippet of my code:
filter.js
.filter('myFilter', function() {
return function(sports, filterBy) {
if (!sports || !filterBy) {
return sports;
}
filterBy = filterBy.toLowerCase();
return sports.filter(function(sport) {
return (sport.name.toLowerCase().indexOf(filterBy) > -1) || sport.leagues.some(function(league) {
return league.name.toLowerCase().indexOf(filterBy) > -1;
});
});
};
});
sportsLeagues.html
<div ng-repeat="sport in sportsFilter = (sports | myFilter:query)">
<strong>{{sport.name}}</strong>
<div ng-repeat="league in sport.leagues | filter: { name:query }">
<div>{{league.name}} </div>
</div>
</div>