Edit in JSFiddle

//宣告ng-app
var demoApp = angular.module("demoapp", []);

//ng-app底下掛載ng-controller
demoApp.controller("demoCtrl", function($scope) {
  $scope.name = 'Ryan';
});

//ng-app底下掛載directive
demoApp.directive('repeater', function() {
  return {
    restrict: 'A',
    transclude: true, //利用原本的內容
    compile: function(tElement, tAttrs, transclude) {
      var template = "<div ng-transclude></div>"; //ng-transclude為原本的內容
      console.log(transclude);
      for(var i=0; i<tAttrs.repeater; i++) {
        tElement.append(template);
      }
    }
  };
});

<div ng-app="demoapp">
  <div ng-controller="demoCtrl">
    <h1>AngularJs directive link Demo</h1>
    <h3>利用directive的compile實做「指定重複內容的directive」</h3>
    
    <ul repeater="20">
      <li>我是{{name}}</li>
    </ul>
  </div>
</div>