AngularUI Bootstrapモーダルオープンイベント

Question

リンク経由でブートストラップモーダルダイアログを呼び出しています。

ダイアログがポップアップすると、角度コントローラーでタイマーを開始したいと思います。どのようにして、タイマーを開始するために角度コントローラのダイアログオープンイベントを検出するのですか？私はこのような範囲でタイマーを起動した場合

、

app.controller('myctrl', 
    ['$scope', '$window', '$timeout', 'svc', 
    function ($scope, $window, $timeout, svc) { 

     $scope.countdown = 10; 

     $scope.runCounter = function() { 
      $scope.countdown -= 1; 
      if ($scope.countdown > 0) 
       $timeout($scope.runCounter, 60000); 
     } 
     $scope.runCounter(); 
    }]); 

タイマーがスタート

は、アプリケーションが起動したとき。ダイアログが開いたときにだけタイマーを開始したい。おかげさまで

Answer 1

alert($('#myModal').hasClass('in')); 

を参照してください。あなたはおかしくモーダルがDOMに実際にある前に、残念ながらopen.then（funcは）走る

Answer 2

thisをチェックしてください。 $modal.open()

var modalInstance = $modal.open({...}); 
modalInstance.opened.then(function() { 
    alert("OPENED!"); 
}); 

は、他の特性のうち、opened約束が含まれ、上記のように使用する、オブジェクトを返します。

Answer 3

http://angular-ui.github.io/bootstrap/からモーダルを使用しているとします。

詳細を見ると、コンポーネントがダイアログを開いたときに解決される約束を公開していることがわかります。あなたが使う必要があるものはどれですか。あなたはモーダルが作成され、コントローラにそのような何かを行うことができます。

$scope.runCounter = function() { 
    $scope.countdown -= 1; 
    if ($scope.countdown > 0) 
    $timeout($scope.runCounter, 60000); 
} 

//Creating the dialog 
var modalInstance = $modal.open({ 
    templateUrl: 'myModalContent.html', 
    controller: ModalInstanceCtrl 
    } 
}); 

//Add a function for when the dialog is opened 
modalInstance.opened.then(function() { 
    $scope.runCounter 
}); 

モーダルが開いている場合にはtrueを返します作業plunker here

Answer 4

var modalInstance = $modal.open({ 
 
       templateUrl: '../augustine_app/templates/program_purchase_popup.html', 
 
       backdrop: 'static', 
 
       controller: function ($scope, $modalInstance) { 
 
        $scope.cancel = function() { 
 
         $modalInstance.dismiss('cancel'); 
 
        }; 
 
       } 
 
      }); 
 

 
      
 

 
      if (navigator.userAgent.match(/iPhone|iPad|iPod/i)) { 
 
       modalInstance.opened.then(function() { 
 
        var modal; 
 
        var getModalInterval = function() { 
 
         modal = document.getElementsByClassName('modal')[0]; 
 
         if (modal) { 
 
          clearInterval(getModal); 
 
          modal.style.marginTop = window.screenTop + 'px'; 
 
          modal.style.height = 'auto'; 
 
          modal.style.position = 'absolute'; 
 
          modal.style.overflow = 'visible'; 
 
         } 
 
        }; 
 
        modal = document.getElementsByClassName('modal')[0]; 
 
        if (!modal) { 
 
         var getModal = setInterval(getModalInterval, 2000); 
 
        } 
 
       }); 
 
      } 
 
     };

..そしてuはあなたのカウントダウンイベントを開始することができますモーダルウィンドウが開いているかどうかをチェックしたりすることはできません。したがって、setInterval。

ここにいくつかの非jQuery角度コードがあります。