If you want to use controllers, instead of a link function, you can use bindToController.
<!DOCTYPE html>
<html ng-app="app">
<head>
<title>Egghead.io Tutorials</title>
<style>body{padding:20px}</style>
<link rel="shortcut icon" href="favicon.ico">
<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css" rel="stylesheet">
<script src="//cdnjs.cloudflare.com/ajax/libs/angular.js/1.3.3/angular.js"></script>
<script src="app.js"></script>
</head>
<body> <note message="hello"></note>
</body>
</html>
angular.module("app", [])
.directive("note", function note() {
return {
scope: {
message: "@" //pass in a string
},
bindToController: true,
controller: "NoteCtrl as note",
template: "<div>{{note.message}}</div>"
};
})
.controller("NoteCtrl", function NoteCtrl() {
var note = this;
});