Dynamically add directives in AngularJS

For a walkthrough see http://blog.fourtonfish.com/post/74055065673/dynamically-add-directives-in-angularjs-no-jquery

by Keval Bhatt

HTML

<section ng-app="myApp" ng-controller="reviewCtrl">
    <date-picker></date-picker>
    <div id="space-for-buttons"></section>
</section>

CSS

section{
    padding: 2em;   
}
button{
    padding:0.3em;
    margin: 0.3em;
}
.test{
    background:green;
}
}

JavaScript

var myApp = angular.module('myApp', []);

function reviewCtrl($scope) {
	$scope.count = 0;
}

//Directive for showing an alert on click




myApp.directive("datePicker", function() {
    return {
        restrict: "E",
        template: '<div>I want this to show up in my review view</div>'
  }      
});