CODEWITHSUNDEEP
angularjsangularjs-ng-click
Eric Soyke
Eric Soyke

Reputation: 1067

Can't remove ng-click from element

I am trying to disable certain links. They are within a third party component in our navbar so I can't just change the source HTML, so instead I want to remove the ng-click from my controller. I have been able to find and update the elements but the ng-click event is still happening, even though inspecting the element in the browser shows it to no longer have an ng-click?

HTML:

<div ng-app="myApp" ng-controller='myController'>
  <div id="myDIV">  
    <ul>
      <li><a ng-click='value=value+1'>click me to add value</a></li>
      <li>not a link</li>
    </ul>
  </div>
  <input ng-model="value" />

Javascript:

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

app.controller('myController', ['$scope',
  function($scope) {
    $scope.value = 0;
    var items = document.getElementById("myDIV").getElementsByTagName("ul")[0].getElementsByTagName("li");
    _.each(items, function(item){
      var link = item.getElementsByTagName('a');
      if(link[0]){
        console.log('before: ',link[0]);
        var myElement = angular.element( link[0] );
        myElement.removeAttr('ng-click');
        console.log('after: ',myElement);
      }
    });
  }
]);

Fiddle: http://jsfiddle.net/esoyke/s9gdxsc0/

Upvotes: 0

Views: 1699

Answers (1)

bunny1985
bunny1985

Reputation: 772

well you should not do that, however.....

setTimeout(function(){ 
  angular.element(link).unbind('click'); 
  console.log("unbind");
}, 100);

should do the "ugly hack". to make it little better find a way to get rid of setTimeout, since angular binds events in some order and you have to unbind it after that.

Still, it's an ugly hack. you could do it better. Maybe there is a possibility to "decorate" your "closed source component" or something.

Upvotes: 1

Related Questions