How to bind variables to the translated part

How to bind variables from scope to a transformed template?

app.directive('foo', function(){
    return {
        restrict: 'E',
        transclude: true,
        template: '<div ng-transclude></div>',
        link: function (scope) {
            scope.num = 5;
        }
    }
})

<div ng-app="app">
    <foo>
        {{num}}
    </foo>
</div>

      

+3


source to share


1 answer


You are missing an application module. I also added a class modified

so you can see the template being applied:

var app = angular.module("app", []);

app.directive('foo', function(){
    return {
        restrict: 'E',
        transclude: true,
        template: '<div class="modified" ng-transclude></div>',
        link: function (scope) {
            scope.num = 5;
        }
    }
});

      



See plnkr: http://plnkr.co/edit/x9NE6A4kkqspKbO08yhq?p=preview

+2


source







All Articles