0

私のコードでは、ボタンのタップ時に ionicPopup をトリガーすると、別の ionicPopup がトリガーされますが、前の ionicPopup を閉じる必要があります。ただし、私の実装では、最終的な ionicPopup を閉じますが、最初の ionicPopup は閉じず、アプリをフリーズさせます。すべての ionicPopup が閉じていることを確認する方法はありますか、少なくともボタンのタップ時に各 ionicpopup を閉じる方法はありますか。これは私のコードのコードペンですhttp://codepen.io/anon/pen/dYVdJv

 $scope.showPopup = function() {
   $scope.data = {}

    $ionicPopup.show({
      title: ' Session Terminated!',
      scope: $scope,
      template:' You are currently logged into another device/browser. Pls log out from your other device/browser!',
      buttons: [
        { text: '<h6 style="text-transform: capitalize;">Cancel</h6>',
          type: 'button-positive'
        },
        {  
          text: '<h6 style="text-transform: capitalize;">Verify Me</h6>',
          type: 'button-positive',
          onTap: function(e) {
            $scope.verifyMe();
          }
        }
      ]  
    }).then(function(res) {
      console.log('Tapped!', res);
    }, function(err) {
      console.log('Err:', err);
    }, function(popup) {
      console.log('Got popup', popup);
      $timeout(function() {
        popup.close();
      }, 1000);
    });
  }; 

  $scope.verifyMe = function() {
    $ionicPopup.show({
      title: ' Enter Username',
      scope: $scope,
      template:'<input type="text" ng-model="user.username">',
      buttons: [
        {  
          text: '<h5 style="text-transform: capitalize;">Verify Me</h5>',
          type: 'button-positive',
          onTap: function(e) {
            $scope.verifyNow('first.app');
          }
        }
      ]  
    }).then(function(res) {
      console.log('Tapped!', res);
    }, function(err) {
      console.log('Err:', err);
    }, function(popup) {
      console.log('Got popup', popup);
      $timeout(function() {
        popup.close();
      }, 1000);
    });
  };

  $scope.verifyNow = function(username)   {
    console.log("verified and removed" + username)
  }

コードの実行が完了したら、コードをチェックするとこれが得られます

<div class="popup-container popup-showing popup-hidden" ng-class="cssClass">
  //more code here
</div>

これは実際には最初の ionicPopup.show({}) で開かれたポップアップであり、2 番目の ionicPopup.show({}) は閉じられます。最初のものが閉じずに非表示になる理由がわかりません。

4

3 に答える 3

2

これが実際の例です。私はあなたのコードと一緒に Ionic docs で与えられた例を使用しました:

    var myPopup = $ionicPopup.show({
      title: ' Enter Username',
      scope: $scope,
      template: '<input type="text" ng-model="user.username">',
      buttons: [{
        text: '<h5 style="text-transform: capitalize;">Verify Me</h5>',
        type: 'button-positive',
        onTap: function(e) {


          myPopup.close();
          return console.log("verified and removed");
        }
      }]
    });

  };
  // A confirm dialog
  $scope.showConfirm = function() {
    var confirmPopup = $ionicPopup.confirm({
      title: ' Session Terminated!',
      scope: $scope,
      template: ' You are currently logged into another device/browser. Pls log out from your other device/browser!',
      buttons: [{
        text: '<h6 style="text-transform: capitalize;">Cancel</h6>',
        type: 'button-positive'
      }, {
        text: '<h6 style="text-transform: capitalize;">Verify Me</h6>',
        type: 'button-positive',
        onTap: function(e) {
          confirmPopup.close();

          $timeout(function() {
            $scope.showPopup();
          });

        }
      }]
    });
    confirmPopup.then(function(res) {
      if (res) {
        console.log('You are sure');
      } else {
        console.log('You are not sure');
      }
    });
  };

  // An alert dialog
  $scope.showAlert = function() {
    var alertPopup = $ionicPopup.alert({
      title: 'Don\'t eat that!',
      template: 'It might taste good'
    });
    alertPopup.then(function(res) {
      console.log(
        'Thank you for not eating my delicious ice cream cone');
    });
  };

知らせ

 $timeout(function() {
            //code
          });

実際に を待ってから、 confirmPopup.close();内部にあるものを実行します (この場合は、新しいポップアップを開きます)。

于 2015-10-16T09:32:42.983 に答える
0
$ionicPlatform.on("pause", function () {

  $ionicBody.removeClass('popup-open');
  var popup = angular.element(document.getElementsByClassName('popup-container'));
  if (popup) {
    var backdrop = angular.element(document.getElementsByClassName('backdrop'));
    if (backdrop) {
      backdrop.remove();
    }
    popup.remove();
  }


  $ionicBody.removeClass('modal-open');
  var modal = angular.element(document.getElementsByClassName('modal-wrapper'));
  if (modal) {
    var modalBackdrop = angular.element(document.getElementsByClassName('modal-backdrop'));
    if (modalBackdrop) {
      modalBackdrop.remove();
    }
    modal.remove();
  }
});
于 2016-10-27T08:54:55.197 に答える
0

私は、Facebook ConnectプラグインからfacebookConnectPlugin.apiを呼び出す前に、いくつかの個人データを尋ねるポップアップを表示する必要があるプロジェクトで作業しています(資格情報用の独自のポップアップがあります)。

ログインに成功した後、ポップアップは表示されませんが、popup-containerはまだ DOM の一部であり、popup-openクラスは本体にアタッチされています。

私は成功せずに $timeout アプローチを試みました (少なくともユーザーの観点からはアプリはまだフリーズしています)。

1.-これは良い考えではありませんが、IMHO $ionicPopup サービスには、通常の close メソッドが失敗した場合にすべてを強制的に削除する方法が含まれている必要があります。

IonicModule.factory('$ionicPopup', [...]

追加

popup.responseDeferred.promise.remove = function popupRemove(result) {
  popup.element.remove.();
};

これにより、メソッド remove() を呼び出すことで、ポップアップに破壊を召喚する力が与えられます

2.- 私が実際に行ったことは、popup-class を手動で削除してから、ビューを離れる前にドキュメントに添付されているポップアップ ツリー全体を削除することです。

$scope.$on("$ionicView.beforeLeave", function(event, data){
  $ionicBody.removeClass('popup-open');
  var popup = angular.element(document.getElementsByClassName('popup-container'));
  if(popup){
    popup.remove();
  }
});
于 2016-09-27T19:40:29.547 に答える