I am encountering an issue with my search box where I am attempting to filter two items, but only one is filtering correctly.
Here is the code snippet in question:
<!--this is the input-->
<input type="search" placeholder="Sports finder" ng-model="query">
<!--this is the working filter-->
<div ng-repeat="sport in sports | filter:query"
ng-show="sport.leagues.length">
<!--this is the problematic filter-->
<div ng-repeat="league in sport.leagues">
I have attempted to fix it by using the following:
<div ng-repeat="league in sport.leagues | filter:query">
According to some feedback I received, the filter is not functioning properly because the last expression is returning an object instead of an array.
Below is the section of code where I am extracting the data:
AuthFactory.getCustomer().then(function(customer) {
$scope.customer = customer;
SportsFactory.getSportsWithLeagues(customer).then(function(sports) {
$ionicLoading.hide();
if (sports.length) {
$scope.sports = sports;
console.log($scope.sports);
console.log('on controller js I am an ' + typeof($scope.sports));
}else {
AuthFactory.logout();
}
The first console log returns:
[Object, Object, Object, Object, Object]
And the second one outputs:
on controller js I am an object
Let's say we open up that data and see that it returns this structure:
>0: Object
>1: Object
>2: Object
>3: Object
>4: Object
>5: Object
If we dive into >0: Object, it reveals:
$$hashKey: "object:54"
checked: true
id: 26
> leagues: Array[3]
name: 'Live Betting'
priority: 0
> proto: Object
Essentially, the filter functions as expected on the initial
[Object, Object, Object, Object, Object]leagues: Array[3].
If this explanation is unclear, please refer to these screenshots:
and:
This situation is quite perplexing. Here is a Plunkr example that works as intended, featuring JSON data taken from the network console.
For instance, searching for International or Greece yields the correct filters:
International Basketball
GREECE A1
In contrast, when typing just Greece in my app, the filter fails to return any results.
UPDATE
Please review this Plunkr, which is not functional but provides access to my complete code: http://plnkr.co/edit/bfU8ynzmsQZk57dYXFUj?p=preview