title: AngularJS Directive element method binding - TypeError: Cannot use 'in' operator to search for 'functionName' in 1
body: <p>This is the controller of the main template:</p>
  
  <pre><code>app.controller('OverviewCtrl', ['$scope', '$location', '$routeParams', 'websiteService', 'helperService', function($scope, $location, $routeParams, websiteService, helperService) {
      ...     
      $scope.editWebsite = function(id) {
          $location.path('/websites/edit/' + id);
      };
  }]);
  </code></pre>
  
  <p>This is the directive:</p>
  
  <pre><code>app.directive('wdaWebsitesOverview', function() {
      return {
          restrict: 'E',
          scope: {
              heading: '=',
              websites: '=',
              editWebsite: '&amp;'
          },
          templateUrl: 'views/websites-overview.html'
      }
  });
  </code></pre>
  
  <p>This is how the directive is applied in main template:</p>
  
  <pre><code>&lt;wda-websites-overview heading="'All websites'" websites="websites" edit-website="editWebsite(id)"&gt;&lt;/wda-websites-overview&gt;
  </code></pre>
  
  <p>and this is method is called from directive template (website-overview.html):</p>
  
  <pre><code>&lt;td data-ng-click="editWebsite(website.id)"&gt;EDIT&lt;/td&gt;
  </code></pre>
  
  <p>QUESTION: When EDIT is clicked, this error appears in the console:</p>
  
  <blockquote>
    <p>TypeError: Cannot use 'in' operator to search for 'editWebsite' in 1</p>
  </blockquote>
  
  <p>Does anyone know what goes on here?</p>