How to send image information to Popup - Ionic

Question

I need to open a Popup windows with an image on it. But I'm not managing to make the link between the image and the popup to work, how do I right it correctly?

Here's the code for the js popup controller:

 $scope.imginstaFull = function() {
      $scope.data = {};
      $scope.imgFull = 'img/teste/insta1.jpg';
        
    
      // An elaborate, custom popup
      var myImg = $ionicPopup.show({
        template: '<ion-list style="color:black;">'+
                  '<img style="height:67vw; width:90%; border-radius:10px; 
margin:5%; background-image:url({{imgFull}});">'+   
                  '</ion-list>',                                     
        buttons: [    
          {  
            text: '<i class="icon button-icon ion-ios-close-outline"></i>',
      type:'popclose',
              
          }
        ]
      });

and here's the code for the html image that I want to open:

<div class="col col-33 paddingPerfil colinstagram" style="background-image:url('img/teste/insta1.jpg')">             
    <button class="button button-clear button-full" ng-click="imginstaFull()"></button>       
</div>

score 2 · Accepted Answer · edited Mar 09 '17 at 14:40

2

I see you are using {{imgFull}} to reference the image inside the popup options. By sharing the original scope (using the scope: $scope attribute inside the $popup.show options, you should be able to access the $scope.imgFull you originally declared. For example:

  $scope.imgFull = 'img/teste/insta1.jpg';
  var myImg = $popup.show({
      template: '<img style="background-image:url({{imgFull}});"></img>',
      scope: $scope,
      buttons: [  
        {  
          text: '<i class="icon button-icon ion-ios-close-outline"></i>',
          type:'popclose',

        }
      ]
   });

edited Mar 09 '17 at 14:40

Slava.K

3,073
3
17
28

answered Mar 09 '17 at 14:32

Gabriel Lovetro

410
7
9

1

Thank you, I was reading more about it, and realized I'm using the wrong solution for what I want, I should be using Modal instead. But thank you so much for this, it may help with later solutions. – GustavoA Mar 09 '17 at 20:45

How to send image information to Popup - Ionic

1 Answers1