Wie können Bilder in Modal Bootstrap mit AngularJS und ng-repeat derective angezeigt werden?

Question

ich habe einfach AngularJS Anwendung, ich versuche Display Bilder in modal Verwendung Bootstrap, alle Fotos auf Seite i Verwendung ng-repeat Richtlinie sind Anzeige:

<div class="col-md-3" ng-repeat="photo_item in allPhotosOfSingleAlbum"> 
    <img id="myImg" ng-src="../Files/Photos/{{photo_item.link}}" width="250px" height="160px" class="img-rounded" /> 
</div> 

und ich habe die Code des modalen:

<div id="imageModal" class="modal"> 
    <span class="close" onclick="document.getElementById('imageModal').style.display='none'">&times;</span> 
    <img class="modal-content" id="img01" /> 
</div> 

Sag mir bitte, wie ich es sowohl ng-repeat und modal verwenden kann? Danke für Ihre Antworten!

Answer 1

Bewegen Sie einfach Ihren ersten Code, wo Sie ng-repeat in modal haben und Sie sollten Ihre Bilder dort zeigen können.

<div id="imageModal" class="modal"> 
    <span class="close" onclick="document.getElementById('imageModal').style.display='none'">&times;</span> 
    <div class="col-md-3" ng-repeat="photo_item in allPhotosOfSingleAlbum"> 
      <img id="myImg" ng-src="../Files/Photos/{{photo_item.link}}" width="250px" height="160px" class="img-rounded" /> 
     </div> 
</div>