Dynamic/procedural modals by variable prameter


#1

What I want to do is to load modal with data from array with index which I provide as variable. Whoever I’am not sure if it’s proper way to do so please provide everything what sould suit my situation.

So right now I have this list

<div class="item item-thumbnail-left" href="#" ng-repeat="item in dovanosListArray" >
      <img ng-src={{item.image}}> 
      <h2>{{item.name}}</h2>
      <button menu-toggle="right"class="mygtukasreklamoj button-icon icon ion-ios7-arrow-forward" ng-click="modal.show()"></button>
      <p>Nuolaida : {{item.discount}} %</p> 
    </div>

And every list item have this button which always open ups modal with modal.show() however right now it always opens same modal for all buttons from template that I have provided to it.

What i want to do is to have something like this in my modal template
{{Array[id].item}}
{{Array[id].desc}}

and I want to provide that id as parameter to modalcontroller somethink like ng-click=“modal.show(item.index)” so it loads proper modal for each list item that I click. I understand it not correct to write like this, but I’am just trying to explain

Here is my controller

.controller('MainCtrl', function ($scope, $state, $ionicModal) { 
    console.log('Pgr controleris');

    // Load the modal from the given template URL
    $ionicModal.fromTemplateUrl('templates/modal.html', function (modal) {
        $scope.modal = modal;
    },
     {
         // Use our scope for the scope of the modal to keep it simple
         // The animation we want to use for the modal entrance
         animation: 'slide-in-up'

     }
     );
    $scope.$on('$destroy', function () {
        $scope.modal.remove();
        console.log('trinu');
    });
    
    $scope.toIntro = function () {
        $state.go('intro');
    }

    
})

and this is my modal controller

.controller('ModalCtrl', function ($scope) {
    console.log('inializinu');
    $scope.dovanosListArray1 = [{
        name: "dovana",
        image: "1364304258.jpg",
        discount: 7,
    }, {
        name: "Antra dovana",
        image: "logo.png",
        discount: 30,
    }, {
        name: "trecia dovana",
        image: "logo.png",
        discount: 5,
    }];


});