Я знаю, что этот вопрос задан раньше, но не может найти адекватного способа сделать это. Какова наилучшая практика для углового передачи данных в загрузочный модальный?Передача данных в Bootstrap modal с помощью Angular
Есть пункт карусели, на который вы можете щелкнуть, а затем модальный должен появиться в соответствии с соответствующими данными предмета.
Вот коды:
HTML:
<div id="winit-slider-1" class="winit-slider" ng-controller="winitCtrl">
<div class="winit-item text-center" ng-repeat="winit in winits">
<img src="{{winit.photo}}" class="width-100">
<h4 class="text-red">{{winit.filled}}</h4>
<h3>{{winit.title}}</h3>
<a href="#" class="btn btn-block btn-md btn-winit margin-bot-10">Winit!</a>
<div class="social-icons">
<a href="#"><i class="fa fa-facebook" aria-hidden="true"></i></a>
<a href="#"><i class="fa fa-twitter" aria-hidden="true"></i></a>
<a href="#"><i class="fa fa-pinterest-p" aria-hidden="true"></i></a>
<a href="#"><i class="fa fa-youtube" aria-hidden="true"></i></a>
</div>
</div>
</div>
app.js
var app = angular.module('winitApp', ["angularModalService"]);
app.controller('winitCtrl', function($scope, ModalService) {
var winits = [
{
id:1,
photo:"https://cdnb.lystit.com/photos/1678-2015/11/04/gucci-us-beigeblue-gg-supreme-childrens-gg-supreme-backpack-beige-product-4-168315478-normal.jpeg",
filled:"40% Full in 3 Days",
title:"Olivia-Burton Women Watch"
},
{
id:2,
photo:"http://images.bigcartel.com/product_images/122941467/fin_pegleg_brd2.jpg?auto=format&fit=max&h=1000&w=1000",
filled:"80% Full in 2 Days",
title:"Super-Cool Fast Skateboard"
},
{
id:3,
photo:"http://i01.i.aliimg.com/wsphoto/v0/581102529_1/New-Vintage-Fashion-Gear-Handmade-Genuine-Leather-Strap-Watches-Disc-Diamond-Women-s-Wristband-Watch-Free.jpg",
filled:"45% Full in 8 Days",
title:"Most-Expensive Watch Ever"
},
{
id:4,
photo:"https://cdnb.lystit.com/photos/1678-2015/11/04/gucci-us-beigeblue-gg-supreme-childrens-gg-supreme-backpack-beige-product-4-168315478-normal.jpeg",
filled:"40% Full in 3 Days",
title:"Olivia-Burton Women Watch"
},
];
$scope.winits = winits;
ModalService.showModal({
})
});
Какие данные вы пытаетесь передать? Я не вижу никаких данных, просто ссылок и не ng-модели. –
Только изображение URL и название. Мне интересно, как я могу сделать модалы динамическими в зависимости от того, на какой элемент вы нажимаете. Есть идеи? – jake
Вы используете только бутстрап? Нет других угловых компонентов? –