title: Is it possible to expand elements from multiple arrays using ng-repeat?
body: <p>I'm working my way through angular js, and wrestling with ng-repeat and directives. It looks ng-repeat symbols aren't expanded in the attributes of directives. What I'd like to do is take two arrays <code>["a1", "a2", "a3"]</code> and <code>["b1", "b2", "b3"]</code> </p>
  
  <p>My markup looks like this:</p>
  
  <pre><code>&lt;div ng-app="app"&gt;
      &lt;div ng-controller="TestController"&gt;
          &lt;div ng-repeat="a in as"&gt;
              &lt;h2&gt;{{a}}&lt;/h2&gt; &lt;!-- Works fine. --&gt;
              &lt;directive-test a="test" b="test"&gt;&lt;/directive-test&gt;
              &lt;div ng-repeat="b in bs"&gt;
                  &lt;h3&gt;{{b}}&lt;/h3&gt; &lt;!-- Works fine. --&gt;
                  &lt;directive-test a="{{a}}" b="{{b}}"&gt;&lt;/directive-test&gt;&lt;!-- Does not work. --&gt;
              &lt;/div&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>and the backing javascript looks like this:</p>
  
  <pre><code>var app = angular.module("app", []);
  
  app.controller('TestController', ['$scope', '$window', function ($scope, $window) {
      $scope.as = ['a1', 'a2', 'a3'];
      $scope.bs = ['b1', 'b2', 'b3'];
  }]);
  
  app.directive('directiveTest', function () {
      return {
          restrict: "E",
          replace: true,
          transclude: true,
          scope: true,
          template:
              '&lt;div&gt;{{a}} by {{b}}&lt;/div&gt;',
          controller: ['$scope', '$element', '$attrs', function ($scope, $element, $attrs) {
              $scope.a = $attrs.a;
              $scope.b = $attrs.b;
          }]
      };
  });
  </code></pre>
  
  <p>I'd expect the <code>{{a}}</code> and <code>{{b}}</code> to be expanded and see output like "a1 by b1", but instead, I see output like <code>{{a}} by {{b}}</code>. Is there a way to expand ng-repeat elements to use as attributes of custom directives?</p>
  
  <p><a href="http://jsfiddle.net/YbPFr/17/" rel="nofollow">JSFiddle here.</a></p>