如何将图像信息发送到Popup - Ionic

时间:2017-03-09 13:09:31

标签: css angularjs ionic-framework ionicpopup

我需要打开一个带有图像的弹出窗口。但是我没有设法使图像和弹出窗口之间的链接正常工作,我该如何正确地理解它呢?

这是js弹出控制器的代码:

 $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',
              
          }
        ]
      });

这是我要打开的html图像的代码:

<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>

1 个答案:

答案 0 :(得分:2)

我发现您正在使用{{imgFull}}来引用弹出选项中的图像。通过共享原始范围(使用scope: $scope选项中的$popup.show属性,您应该能够访问最初声明的$scope.imgFull。 例如:

  $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',

        }
      ]
   });