AngularJS - Pass parameter to filter in custom directive

Question

I'm trying to pass a parameter (true, false) to a filter in a custom directive, but I always get an 'undefined'.

<job jobs="jobs" activateFilter="activateFilter">

In a controller (outside of customDirective):

$scope.activateFilter = true;

This is the directive:

...
restrict: 'E',
        scope: {
            jobs: "=jobs",
            activateFilter: "=activateFilter"
        },
        controller: controller,
        templateUrl: "/views/templates/job.html"
...

And this is the template:

... data-ng-repeat="job in jobs | customFilter:activateFilter ...

Any ideas what I'm doing wrong? activateFilter is always undefined. Thanks!!

eladcon · Accepted Answer · 2015-05-12 09:21:18Z

1

Try to set the attribute name to lower case and dash-delimited:

<job jobs="jobs" activate-filter="activateFilter">

See this under Normalization and Isolating the Scope of a Directive

Note: These =attr attributes in the scope option of directives are normalized just like directive names. To bind to the attribute in div bind-to-this="thing", you'd specify a binding of =bindToThis.

answered May 12, 2015 at 9:21

eladcon

5,8251 gold badge18 silver badges19 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Max Berg Over a year ago

Solution: $scope.activateFilter = true; <job jobs="jobs" activate-filter="activateFilter"> Directive: activateFilter: "=activateFilter", data-ng-repeat="job in jobs | jobfilter:activateFilter"

Collectives™ on Stack Overflow

AngularJS - Pass parameter to filter in custom directive

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related