CODEWITHSUNDEEP
angularjs
user1184100
user1184100

Reputation: 6894

Click event not firing when attached in directive compile

I'm trying to attach click event for li's from inside of compile function and I can see the ng-click being present in the dom but the event is not fired.

compile:function (elem, attrs){

      //elem.find('li').attr('data-ng-click', 'hello()');
      elem.find('li').attr('ng-click', "hello($event)");

      return function(scope, elem, attrs) {
          scope.hello = function ($event) {
            console.log($event);
            alert('click triggered')
          };       
 }

Plnkr : http://plnkr.co/edit/o8JyJM?p=preview

Upvotes: 0

Views: 581

Answers (2)

shaunhusain
shaunhusain

Reputation: 19748

Just adding an attribute that is itself a directive won't cause it to be processed. Every element that is going to have directives in it needs to be run through $compile for the link function to be created and then the link function needs to be called with a scope object passed to it (typically created using $rootScope.new()). All that said there are typically easier ways to accomplish what you want just using the ng-click in the template (which is compiled) or using element.bind("click",function(evt){}). I'll fix up the plunkr in a bit here too.

Upvotes: 1

Dima Grossman
Dima Grossman

Reputation: 2830

The scope is not available in the compile stage of the directive. it is available only at the link phase. i suggest you to switch the compile to a link function (if you dont have some specific need for compile function like in the snippet above.)

Upvotes: 0

Related Questions