title: How do you not override other angular directives when using isolate scope and still being able to call methods in the scope?
body: <p>I have an anchor tag that I wish to hide or show depending on a value in the model.</p>
  
  <pre><code>&lt;table&gt;
      &lt;tr ng-repeat="item in items"&gt;
          &lt;td&gt;Other Stuff&lt;/td&gt;
          &lt;td&gt;
              &lt;a href="#/somewhere" ng-show="model.showIt" myCustomDir="some value" onClick="bar(item)" /&gt;
          &lt;/td&gt;
      &lt;/tr&gt;
  &lt;/table&gt;
  </code></pre>
  
  <p>Now in my directive I have the following:</p>
  
  <pre><code>app.directive('myCustomDir', function() {
      var def = {
          restrict: 'A',
          scope: {
              onClick: "&amp;"
          },
          link: function(scope, element, attrs) {
  
              var hover = angular.element("&lt;div&gt;&lt;b&gt;Some Text&lt;/b&gt;&lt;/div&gt;");
              var button = hover.find('b');
  
              button.on('click', function() {
                 scope.$apply(function() {
                     scope.onClick();
                 })
              });
          }
      };
  
      return def;
  })
  </code></pre>
  
  <p>The problem is as soon as I include my directive the ng-show one I think no longer works and that is because if I am correct it is because my directive works in isolate scope so the model from the parent scope is no longer present. </p>
  
  <p>How would I get my directive to play nicely with ng-show while still being able to let someone what method they want to call when the  tag is clicked.</p>
  
  <p>Plunker for all those interested. <a href="http://plnkr.co/edit/BLMCgB" rel="nofollow">http://plnkr.co/edit/BLMCgB</a></p>