title: Angular Directive - Dynamic Controller
body: <p>I have been assigned the task of creating a set of "cards" like on Google one and other similar sites using AngularJS for a dashboard. Each card has independent functionality from the rest and they all must appear as soon as their data has been returned from the API. In the future we are going to allow for the pinning/unpinning of these cards to the dashboard, as well as ordering to be customized by the user.</p>
  
  <p>I have created a "card-dealer" directive that will contain an ng-repeat for each card in an array of card objects. Each of these cards needs to have their own dynamic template and controller, which is where I have ran into an issue. I was able to figure out how to pass in a dynamic <code>templateUrl</code>, but the controller is a different story. I have all but got it figured out by mimicking what I watched on a Pluralsight video, I should just be able to pass a <code>card.controller</code> variable into the directive "ctrl" attribute like this:</p>
  
  <pre><code>&lt;card-dealer ng-repeat="card in cards" card="card" ctrl="{{card.controller}}"/&gt;
  </code></pre>
  
  <p>However, the <code>ctrl='{{card.controller}}'</code> variable in the directive is not being parsed before it is sent to the directive. In the directive I set the controller dynamically by setting <code>controller: '@'</code> and <code>name: 'ctrl'</code>. This looks into the element for the attribute named "ctrl" and returns it's value as the name of the controller. This method works when I type in the string name of the directive controller instead of using the <code>{{card.controller}}</code> variable, but simply typing a string isn't dynamic.</p>
  
  <p>I need the variable to be parsed before it reaches the directive so that it looks for the proper controller name. I have created a JS Fiddle to demonstrate my issue: <a href="http://jsfiddle.net/kPdCk/" rel="nofollow">http://jsfiddle.net/kPdCk/</a>. This should return two alert boxes, one representing each directive controller. If you run this currently, you'll see in the console log that it is trying to search for a controller with the name of the variable instead of the value of the variable.</p>
  
  <p>Please help!! This is crucial to the future of our entire dashboard, once we figure out how to pass in a dynamic controller name we will be golden. Thanks in advance!!!</p>