AngularJS Directive element method binding - TypeError: Cannot use 'in' operator to search for 'functionName' in 1

Question

This is the controller of the main template:

app.controller(\'OverviewCtrl\', [\'$scope\', \'$location\', \'$routeParams\', \'websiteService\', \'helperServi         


        

Answer 1

Since you defined an expression binding (&), you need to explicitly call it with an object literal parameter containing id if you want to bind it in the HTML as edit-website="editWebsite(id)".

Indeed, Angular needs to understand what this id is in your HTML, and since it is not part of your scope, you need to add what are called "locals" to your call by doing:

data-ng-click="editWebsite({id: website.id})"

Or as an alternative:

data-ng-click="onClick(website.id)"

With the controller/link code:

$scope.onClick = function(id) {
  // Ad "id" to the locals of "editWebsite" 
  $scope.editWebsite({id: id});
}

---

AngularJS includes an explanation of this in its documentation; look for the example involving "close({message: 'closing for now'})" at the following URL:

https://docs.angularjs.org/guide/directive