title: Enable/Disable Anchor Tags using AngularJS
body: <p>How do I enable/disable anchor tags using the directive approach? </p>
  
  <p>Example: </p>
  
  <ol>
  <li>while clicking on edit link, create &amp; delete needs to be disabled or grayed out</li>
  <li>while clicking on create link, edit &amp; delete needs to be disabled or grayed out</li>
  </ol>
  
  <p><strong>JAVASCRIPT:</strong></p>
  
  <pre><code>    angular.module('ngApp', []).controller('ngCtrl',['$scope', function($scope){
  
      $scope.create = function(){
        console.log("inside create");
      };
  
      $scope.edit = function(){
        console.log("inside edit");
      };
  
      $scope.delete = function(){
      console.log("inside delete");
      };
  
      }]).directive('a', function() {
         return {
              restrict: 'E',
              link: function(scope, elem, attrs) {
                  if(attrs.ngClick || attrs.href === '' || attrs.href === '#'){
                      elem.on('click', function(e){
                          e.preventDefault();
                          if(attrs.ngClick){
                              scope.$eval(attrs.ngClick);
                          }
                      });
                  }
              }
         };
      }); 
  </code></pre>
  
  <p><a href="http://plnkr.co/edit/jQSnMfwVo8myeTwUciNU?p=preview">LINK to CODE</a></p>