Question

122

Passing value of a variable to angularjs directive template function

rated 0 times [ 123] [ 1] / answers: 1 / hits: 51151 / 11 Years ago, sat, december 28, 2013, 12:00:00

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', function () {



    return {

        restrict: 'E',



        template: function(element, attrs) {

            console.log(attrs.filterby);

            switch (attrs.filterby) {

                case 'World':

                    return '<input type=checkbox>';

            }

            return '<input type=text />';

        }

    };

});

What I need is the value of variable filterby not the variable name itself.

Plunkr Demo

Answers

Only authorized users can answer the question. Please sign in first, or register a free account.

angelr

Add To Favorites

Follow

Total Points: 399

Total Questions: 96

Total Answers: 101

Location: Finland

Member since Sun, May 21, 2023

1 Year ago

angelr questions

1 Update data of chartjs chart

Tue, Sep 14, 21, 00:00, 3 Years ago

1 Reactjs trigger onClick function without click in functional component

Tue, Jul 14, 20, 00:00, 4 Years ago

1 Can not find 'EJS' Typescript and Express

Mon, Dec 30, 19, 00:00, 5 Years ago

1 How do I refresh a div with AJAX without refreshing the whole page?

Sat, Sep 14, 19, 00:00, 5 Years ago

1 Setting initial value of a Vuetify checkbox

Sun, Jul 7, 19, 00:00, 5 Years ago

View All

answered 11 Years ago kerryoliviaa · Accepted Answer

Or like this

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

  var getTemplate = function(filter) {

    switch (filter) {

      case 'World': return '<input type=checkbox ng-model=filterby>';

      default:  return '<input type=text ng-model=filterby />';

    }

  }



    return {

        restrict: 'E',

        scope: {

          filterby: =

        },

        link: function(scope, element, attrs) {

            var el = $compile(getTemplate(scope.filterby))(scope);

            element.replaceWith(el);

        }

    };

});

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