Question

我需要一个动态弹出窗口，其中图片在单击时会改变其不透明度。它工作得很好，但只有当弹出功能失效时才有效。我需要一个功能。这是我的控制者：

        $scope.imgIds = ['0', '1', '2', '3', '4', '5'];
        $scope.selectedImg = '-1';

        $scope.itemClicked = function(index){
          console.log(index);
          $scope.selectedImg = index;
        }

        /*$ionicPopup.prompt({
          title: 'Como foi seu treino?',
          scope: $scope,
          templateUrl: 'templates/icons.html'
        });*/

        //Envia Mensagem do Treino
        $scope.sendMessage = function(tempo,id_serie) {
          $ionicPopup.prompt({
            title: 'Como foi seu treino?',
            scope: $scope,
            templateUrl: 'templates/icons.html'
          }).then(function(res) {
            $http({
              url: $localStorage.url+'/serie/mensagem', 
              method: 'POST',
              data: {id_serie : id_serie, mensagem :res, tempo: tempo, datahora: $scope.getData()},
              headers : {'Content-Type':'application/json; charset=UTF-8'}
            });
          });
        }      

        //Finaliza Treino
        $scope.finalizar = function() {
          document.getElementById('timer').getElementsByTagName('timer')[0].stop();
          document.getElementById('play').className = 'button icon button-balanced button-block ion-play col';
          var tempo = document.getElementById('timer').getElementsByTagName('timer')[0].innerText;
          var confirmPopup = $ionicPopup.confirm({
            title: 'Atenção',
            template: 'Tempo: '+tempo+'<br>Finalizar Treino?',
            buttons: [
              { text: 'Cancelar',  onTap: function(e) { return false; }},
              { text: '<b>Ok</b>',
                type: 'button-positive',
                onTap: function(e) {
                  document.getElementById('timer').getElementsByTagName('timer')[0].start();
                  document.getElementById('timer').getElementsByTagName('timer')[0].stop();
                  $state.go('tab.series', {});
                  $scope.sendMessage(tempo,$scope.id_serie);
                }
              },
            ]
          });
        }

这是icons.html：

    <style>
        .selected {opacity:1;margin:auto;}
        .unselected {opacity:0.5;margin:auto;}
    </style>
    <div class='row'>
        <img ng-repeat="imgId in imgIds" src="img/{{imgId}}.png" width="30" height="30" 
           ng-class="{'selected':{{imgId}}==selectedImg,'unselected':{{imgId}}!=selectedImg}" ng-click="itemClicked(imgId)"/>
    </div>
    Algum Comentário?<br>
    <input type="text"/>

控制台上没有错误。但是图像不会改变css，弹出窗口会被锁定，按钮也不会做任何事情。

Answer 1

我明白了。问题是我放了$ state.go（'tab.series'）;在调用弹出窗口之前，范围是不同的。

$ ionicPopup上的$ scope无法识别

1 个答案: