hasser
hasser

Reputation: 1076

Simple isolate scope in directive not working

I'm having trouble with a simple isolated scope, using Angular 1.2.24 (latest stable version).

app.directive('myDirective', function() {
return {
    restrict: 'A',
    scope: {},
    link: function(scope) {
         scope.name = 'This is my directive';   
    }
};

});

<div my-directive>{{ name }}</div>

But name is empty. If I remove the scope: {} it works. Why is that?

http://jsfiddle.net/98f97cyt

Upvotes: 0

Views: 76

Answers (2)

hasser
hasser

Reputation: 1076

I found out the answer: AngularJS Scope differences between 1.0.x and 1.2.x

This behaviour is a intended breaking change, that was introduced in Angular 1.2.0 (after rc3).

Upvotes: 0

Shohel
Shohel

Reputation: 3934

Use this way

HTML:

<div ng-app="MyModule">

    <div my-directive>

    </div>
</div>

JS:

angular.module('MyModule', []).directive('myDirective', function() {
    return {
        restrict: 'A',
        scope: {},      
        template:'<div>{{ name }}</div>',
        link: function(scope) {
             scope.name = 'This is my directive';   
        }
    };
});

Upvotes: 1

Related Questions