title: AngularJS Scope as HTML attribute value
body: <p>I am trying to use an AngularJS $scope as an HTML attribute rather than viewable text.</p>
  
  <p>main.js</p>
  
  <pre><code>var myApp = angular.module('myApp');
  
  myApp.controller("buttonCtrl", ['$scope', function($scope){
  
  $scope.johnny = [
      {quote: 'Anything for My Princess', controller: 'Princess'}
  ];
  
  }]);
  </code></pre>
  
  <p>page1.html</p>
  
  <pre><code>&lt;button ng-repeat="button in johnny" 
      ng-class="dynamic" 
      class="topcoat-button"
      ng-controller="{{button.controller}}"   &lt;---- this is what does not work 
      ng-click="play()"&gt;
      {{button.quote}}
  &lt;/button&gt;
  </code></pre>
  
  <p>How can I fix this so I can add these variables as an attribute value.</p>
  
  <p>Thanks</p>