Passing value of a variable to angularjs directive template function

Question

I am trying to pass a $scope\'s variable to a directive, but its not working. I am catching the variable in the template function:

app.directive(\'customdir\', f         


        

Answer 1

First of all, what is a template function? It should be a link function. Second, you're overloading the link function incorrectly, order matters here, its always scope, element, attrs .Third, pass the variable in an isolate scope:

app.directive('customdir', function ($compile) {

    return {
        restrict: 'E',
        scope:{
          filterby:'='
        },

        link: function(scope,element, attrs) {
            console.log(scope.filterby);
            switch (scope.filterby) {
                case 'World':
                    return '';
            }
            return '';
        }
    };
});

or if you insist on attributes then:

 app.directive('customdir', function ($compile) {

        return {
            restrict: 'E',

            link: function(scope,element, attrs) {
                console.log(attrs.filterby);
                switch (attrs.filterby) {
                    case 'World':
                        return '';
                }
                return '';
            }
        };
    });

but in your html:

To ensure the variables value gets evaluated first. Finally you should not be manipulating the DOM like that, in fact that link function won't render html as you'd expect. You have a static template and your link function will act as something to set variable values on the template.