Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
Angular Directives: `=` vs `@` vs `&`
<!DOCTYPE html>
<html>
<head>
<title>Angular</title>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js"></script>
</head>
<body ng-app="myApp">
<div ng-controller="myCtrl as VM">
<a my-dir
attr1="VM.sayHi('Juan')"
attr2="VM.sayHi('Juan')"
attr3="VM.sayHi('Juan')"></a>
</div>
<script>
angular.module("myApp", [])
.controller("myCtrl", [function(){
this.sayHi = function(name){
return ("Hey there, " + name);
}
}])
.directive("myDir", [function(){
return {
scope: { attr1: "=", attr2: "@", attr3: "&" },
link: function(scope){
console.log(scope.attr1); // logs "Hey there, Juan"
console.log(scope.attr2); // logs "VM.sayHi('Juan')"
console.log(scope.attr3); // logs "function (a){return h(c,a)}"
console.log(scope.attr3()); // logs "Hey there, Juan"
}
}
}]);
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.