title: ng-repeat does not work in bootstrap modal
body: <p>I am using <code>ng-repeat</code> to show different contents (i.e, items in an array) in different bootstrap <code>modal</code>, however something weird happens in this <a href="http://plnkr.co/edit/VwR5PEOL6TEkx3sTen8a?p=preview">example</a>. </p>
  
  <p>I include the 'modal' in the <code>ng-repeat</code> like this:</p>
  
  <pre><code>&lt;div ng-repeat="item in items"&gt;
  
    &lt;button type="button" class="btn btn-info" data-toggle="modal" data-target="#example"&gt;
      {{item}}
    &lt;/button&gt;
  
    &lt;div class="modal" id="example"&gt;
      &lt;div class="modal-content"&gt;
        {{item}}
      &lt;/div&gt;
    &lt;/div&gt;
  
  &lt;/div&gt;
  </code></pre>
  
  <p>So the expected result should be three buttons with three different contents (like the <code>&lt;button&gt;</code> 'hi' should have content <code>hi</code>, <code>hello</code> has content <code>hello</code>), however as you see in the example, all three buttons have the same associated modal content.</p>
  
  <p>Any suggestions or comments are appreciated.</p>