Как отображать изображения в модальном бутстрапе, используя директиву AngularJS и ng-repeat?

у меня есть простое приложение AngularJS, я пытаюсь отображать изображения в modal, используя bootstrap, все фотографии на отображаемой странице используют ng-repeat директива:

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

Скажите, пожалуйста, как я могу использовать его как ng-repeat, так и модальный? Спасибо за ваши ответы!


image-gallery angularjs bootstrap-modal
person Uladz Kha    schedule 08.08.2016    source источник

Ответы (1)


arrow_upward
2
arrow_downward

Просто переместите свой первый код туда, где у вас есть ng-repeat в модальном режиме, и вы сможете показывать там свои изображения.

<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>
person Jorawar Singh    schedule 08.08.2016