title: Angularjs passing functions with arguments to directives
body: <p>I have a directive called <code>table-element</code> I am calling like this...</p>
  
  <pre><code>&lt;div ng-controller="Test as ctrl"&gt;
      &lt;table-element edit="ctrl.editfun(ctrl.arg, 'edit')" remove="ctrl.remfun(ctrl.arg, 'rem')"&gt;
          &lt;h3&gt;transcluded content&lt;/h3&gt;
      &lt;/table-element&gt;    
  &lt;/div&gt; 
  </code></pre>
  
  <p>I am passing two functions, <code>edit</code> and <code>remove</code> to the directive with arguments  supplied (<code>ctrl.arg</code>, <code>edit</code> and <code>remove</code>). To my surprise, in the directive <code>link</code> function I can call...</p>
  
  <pre><code>$scope.onClickEdit = function() {
    $scope.edit();
  };
  
  $scope.onClickDelete = function() {             
    $scope.remove();
  };
  </code></pre>
  
  <p>And the functions are still called with the correct arguments. I'm new to Javascript and I don't understand why this works. Can someone explain what happens when <code>$scope.edit()</code> is called, i.e. how the arguments get discovered/passed when the functions are called in the link function? And are there any potential problems with calling methods like this? (here is the full <a href="https://jsfiddle.net/kergoog/whvctzvn/50/" rel="nofollow">fiddle</a>). </p>