title: How to set the dynamic controller for directives?
body: <p>Talk is cheap, show my codes first:</p>
  
  <p>HTML:</p>
  
  <pre><code>&lt;div add-icons="IconsCtrl"&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>directive:</p>
  
  <pre><code>angular.module('attrDirective',[]).directive('addIcons', function($compile){
  return {
      restrict : 'A',
      controller : "IconsCtrl"
      },
      link : function (scope, elem , attrs, ctrl) {
          var parentElem = $(elem);
          var icons = $compile("&lt;i class='icon-plus' ng-click='add()'&gt;&lt;/i&gt;)(scope);
          parentElem.find(".accordion-heading").append(icons);
      },
  }
  </code></pre>
  
  <p>});</p>
  
  <p>controller:</p>
  
  <pre><code>function IconsCtrl($scope){
    $scope.add = function(){
      console.log("add");
    };
  }
  </code></pre>
  
  <p>now it works, when i click the plus icon, browser console output "add".</p>
  
  <p>but i want to set the controller into the directive dynamically,like this:</p>
  
  <p>HTML:</p>
  
  <pre><code>&lt;div add-icons="IconsOneCtrl"&gt;
  &lt;/div&gt;
  &lt;div add-icons="IconsTwoCtrl"&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>Controller:</p>
  
  <pre><code>function IconsOneCtrl($scope){
         $scope.add = function(){
          console.log("IconsOne add");
         };
      }
  
  function IconsTwoCtrl($scope){
      $scope.add = function(){
          console.log("IconsTwo add");
      }
  }
  </code></pre>
  
  <p>directive likes :</p>
  
  <pre><code>angular.module('attrDirective',[]).directive('addIcons', function($compile){
  return {
      restrict : 'A',
      controller : dynamic set,depends on attrs.addIcons
      },
      link : function (scope, elem , attrs, ctrl) {
          var parentElem = $(elem);
          var icons = $compile("&lt;i class='icon-plus' ng-click='add()'&gt;&lt;/i&gt;)(scope);
          parentElem.find(".accordion-heading").append(icons);
      },
  }
  });
  </code></pre>
  
  <p>how to achieve my goal? thanks for your answer!</p>