How to pass $filter inside link function of angular directive

Vivek picture Vivek · Nov 3, 2015 · Viewed 10.1k times · Source

I need $filter inside the link function of angular directive but there is no way to pass $filter as a parameter to link function.

app.directive('myDirective', function($compile) {
  return {
    restrict: 'A',
    scope: {
      ngModel: '=',
    },
    require: 'ngModel',
    link: function($scope, elem, attr, ctrl) {

    }
  };
});

http://plnkr.co/edit/XpnY5dq7rnl2sWXlsN4t?p=preview

How to access the $filter inside link function?

Answer

Matt Way picture Matt Way · Nov 3, 2015

Just inject it into your actual directive function, and then it can be used throughout your directive (including your link function).

app.directive('myDirective', function($compile, $filter){
    return {
        restrict: 'A',
        scope: {
            ngModel: '=',
        },
        require: 'ngModel',
        link: function($scope, elem, attr, ctrl) {
            // call $filter here as you wish

        }
    };
});

Just think of the link function as a private directive function that doesn't deal directly with angular's injection system. By injecting in the main directive function you are essentially saying that all internal functions can use it.