Jack
Jack

Reputation: 7557

AngularJS directive not applied even though the naming convention is correct

This is my directive:

angApp.directive('stopPropagation', function () {
        return {
            restrict: 'A',            
            link: function (scope, elem, attr) {
                console.log(elem);
                $(elem).click(function (e) {
                    e.stopPropagation();
                });
            }
        }
    });

and this is my HTML code:

<form stop-propagation>
</form>

The console.log is never fired. What am I missing?

Upvotes: 1

Views: 37

Answers (1)

Lukas S.
Lukas S.

Reputation: 5758

You're missing ng-app and ng-controller to wire everything together:

<div ng-app="my-app" ng-controller="AppController">
  <form stop-propagation>
    {{message}}
  </form>
</div>

See updated fiddle:

http://jsfiddle.net/u4NZy/2/

Upvotes: 1

Related Questions