angularjs如何创建自定义指令？用angularjs创建自定义指令详细过程

<input ng-model="foo"> <!-- as an attr -->

<input data-ng-model="foo">

<person>{{name}}</person>

<p ng-controller="Controller">
  Hello <input ng-model='name'> <hr/>
  <span ng-bind="name"></span> <br/>
  <span ng:bind="name"></span> <br/>
  <span ng_bind="name"></span> <br/>
  <span data-ng-bind="name"></span> <br/>
  <span x-ng-bind="name"></span> <br/>
</p>

A - attributes    <p person> </p>
C - class name    <p class="person"> </p>
E - element name   <person></person>
M - comments    <!-- directive: person -->

//... 
scope: { customerInfo: '=info' },
//...

angular.module('docsTabsExample', [])
.directive('myPane', function() {
  return {
    require: ['^^myTabs', 'ngModel'],
    restrict: 'E',
    transclude: true,
    scope: {
      title: '@'
    },
    link: function(scope, element, attrs, controllers) {
      var tabsCtrl = controllers[0],
          modelCtrl = controllers[1];

      tabsCtrl.addPane(scope);
    },
    templateUrl: 'my-pane.html'
  };
});