Why is my custom filter not working?

app.js

angular.module('capilleira.clickAndGambleMobile', [
 'capilleira.clickAndGambleMobile.filters'
)]

filter.js

angular.module('capilleira.clickAndGambleMobile.filters', [])
  .filter('sportsFiltered', function() {
    return function(output) {

      return alert('I AM THE FILTER');

    }
  });

whatever.html

 <!--HERE IS THE NG-MODEL-->
 <input type="text" ng-model="sportsFiltered">


<div ng-repeat="sport in sportsFilter = (sports | filter:sportsFiltered)">
  {{sport.name}}
</div>


<div ng-repeat="league in sport.leagues | filter: {leagues: [{'name':sportsFiltered}]}}">
  {{league.name}}
</div>

why does this filter fail alert? or what can I do to understand if a filter works or not?

+4
source share
1 answer

You are using the filter incorrectly, you created the whole filter, so you should use it directly as

sports | sportsFiltered

instead

sports | filter:sportsFiltered

When you use it (sports | filter:sportsFiltered), it is considered a filter (built-in filter) comparator, which you can configure, and it will just run this function (in scope) and based on truth / fake. will decide whether to show this item or not. Therefore, in the end, it does not even consider the actual filter that you created.

{{filter_expression | : : }}

+5

All Articles