AngularJS : Custom Filter function not triggering

Question

I have a controller

app.controller('cartCtrl', function($scope) {

    $scope.$on('updateCart', function(event, cart) {
        $scope.cart = cart;
    });

    $scope.myFilter = function(item) {
        console.log(item);
    };
});   

The view which is loaded by routes :

<div class="shopping-row" data-ng-repeat="item in cart.items | filter:myFilter">
<div>

Now the problem is that myFilter is not triggred. If I call filter:myFilter() it gets triggered but value isn't passed.

I fail to see why this isn't working. Any help appreciated.

Answer 1

What if you use

filter:myFilter(item)

Answer 2

Error is there because you are trying to create a custom filter but you are doing it wrong.

This is how you create it.

angular.module('phonecatFilters', []).filter('checkmark', function() {
  return function(input) {
    return input ? '\u2713' : '\u2718';
  };
});

This is how you use it.

<dd>{{phone.connectivity.infrared | checkmark}}</dd>

References: https://docs.angularjs.org/tutorial/step_09

Answer 3

This problem is cart.items has be an array for the filter function to be called, if it is a object it simply ignores it. ng-repeat would still display the object.