How to create custom directives in AngularJS

Custom directives is created by using directive keyword.

var app = angular.module('app', []);
app.directive("myDir", function () {
 return {
   restrict: "E", //E = element, A = attribute, C = class, M = comment
   scope: false // false: default and inherit parent controller scope.
                // true: directive gets a new scope.
                // {}: directive gets a new Isolated scope
   title: '@' //@ reads attribute value,
              //= provides two-way binding,
              //& works with functions
   },
   template: "<div>{{ myName }}</div>",// define HTML markup
   replace: true, // replace original markup with template yes/no
   transclude: true, // copy original HTML content yes/no
   controller: function (scope) { //define controller, associated with the directive template
   },
   link: function (scope, element, attrs, controller) {//define function, used for DOM manipulation
   }
 }
});