title: Javascript objects as function arguments in Angular directive properties
body: <p>That title is a mouth-full! I've got some code written by another developer that's on leave and is unavailable to explain himself. None of us left in the office can figure out why it works. Any help would be appreciated!</p>
  
  <p>We have a number of directives that use the results of a function defined in the controller as one of the properties. The method on the controller looks something like this.</p>
  
  <pre><code>$scope.required = function(pathString, object){
    /*
      pathString is a string representation pointing to a property in object
      object is 
      Returns true/false for the property described 
      in the path string and the state of the object.
    */
  }
  </code></pre>
  
  <p>Usually, when we use that as a property value for a directive implementation in an html file it looks like this.</p>
  
  <pre><code>&lt;normal-directive
    isrequired='required("Path.to.property", object)'&gt;&lt;/normal-directive&gt;
  </code></pre>
  
  <p>The weird directive is unremarkable in their declaration. It's definition is identical to the normal directives.</p>
  
  <pre><code>directive('weirdDirective', function(){
    return {
      restrict: 'E',
      scope: {
        required: '&amp;isrequired'
      },
      templateUrl: 'path/to/template'
    }
  });
  </code></pre>
  
  <p>The weirdness is in the implementation. Instead of the string and object passed to the function in the normal directives, these two new variable fieldpath and item appear.</p>
  
  <pre><code>&lt;weird-directive
   isrequired='required(fieldpath, item)'&gt;&lt;/weird-directive&gt;
  </code></pre>
  
  <p>The variables fieldpath and item do not appear anywhere in the controller or the weird directive declaration. They are, however, present in the weird directive template, shown below.</p>
  
  <pre><code>&lt;div class='weird-directive'&gt;
   &lt;normal-directive
     isrequired='required({fieldpath:'Path.to.property', item: object})'&gt;&lt;/normal-directive&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>This raises ALL KINDS of questions for me. I thought the call to required was executed in the parent scope, so I don't understand how it's using variables that appear to be assigned a value in the template. Furthermore, objects are usually passed as a single argument, but they appear to have been split out here to provide the required two arguments. </p>
  
  <p>I would very much like to understand how this works, so any help or explanation would be most appreciated!</p>