Dışarıdan/esc tıklandığında Angularjs bootstrap modal kapanış çağrısı

Question

Projemde Angular-ui/bootstrap modelini kullanıyorum.

$scope.toggleModal = function() { 
    $scope.theModal = $modal.open({ 
     animation: true, 
     templateUrl: 'pages/templates/modal.html', 
     size: "sm", 
     scope: $scope 
    }); 
} 

Bir ESC butonuna tıklayarak veya kalıcı alanı dışında tıklayarak modal kapatmak yapabiliyor:

İşte benim kalıcı değildir. Bu olduğunda bir işlevi çalıştırmanın bir yolu var mı? Kapanış türünü nasıl yakalayacağımı tam olarak bilmiyorum.

ben elle böyle bir ng-click="closeModal()" alarak bir kalıcı görevden biliyoruz: herkes yardım edebilirsen, büyük ölçüde

$scope.closeModal = function() { 
    $scope.theModal.dismiss('cancel'); 
}; 

mutluluk duyacağız.

Answer 1

Evet yapabilirsiniz. Bu bir işten çıkarma olayına neden olur ve söz konusu davada verilen söz reddedilir. Ayrıca, $modal.open() yönteminin, söz verilen bir result özelliğine sahip bir nesne döndürdüğünü unutmayın. yapabilirsiniz sözü ile

...

//This will run when modal dismisses itself when clicked outside or 
//when you explicitly dismiss the modal using .dismiss function. 
$scope.theModal.result.catch(function(){ 
    //Do stuff with respect to dismissal 
}); 

//Runs when modal is closed without being dismissed, i.e when you close it 
//via $scope.theModal.close(...); 
$scope.theModal.result.then(function(datapassedinwhileclosing){ 
    //Do stuff with respect to closure 
}); 

kısayol olarak yazabilirsiniz:

$scope.theModal.result.then(doClosureFn, doDismissFn); 

See ref

açık yöntem kalıcı bir örneğini döndürür bir nesne aşağıdaki özelliklere sahip:

• yakın (sonuç) - bir kalıcı kapatmak için kullanılabilecek bir yöntem olup, geçen bir sonucu
• (sebep) kapatmak - bir kalıcı kapatmak için kullanılabilecek bir yöntem olup, bir neden geçen
• sonuç - bir Bir modal kapandığında ve bir modalın reddedildiğinde reddedildiğine dair söz veriyorum
• açıldı - içerik şablonunu indirdikten sonra bir modal açıldığında çözülen bir söz ve 'işlendiğinde' tüm değişkenleri çözümleme - söz konusu olduğunda çözülecek bir söz bir modal oluşturulur.

Answer 2

Sen $ modal.open() yöntemi tarafından döndürülen "sonuç" sözünü kullanabilirsiniz. Çeşitli yakın eylemlere onayı iletişim kutularını eklemek istiyorsanız

 $scope.theModal.result.finally(function(){ 
      console.log("Modal Closed!!!"); 
     }); 

Answer 3

Eski soruya ancak, ekleyin:

$scope.toggleModal = function() { 
     $scope.theModal = $modal.open({ 
      animation: true, 
      templateUrl: 'pages/templates/modal.html', 
      size: "sm", 
      scope: $scope 
     }); 

     $scope.theModal.result.then(function(){ 
      console.log("Modal Closed!!!"); 
     }, function(){ 
      console.log("Modal Dismissed!!!"); 
     }); 
} 

Ayrıca "nihayet" olarak aşağıdaki "sonuç" sözünün geri arama kullanabilirsiniz: körük gibi Bu kalıcı örneği kontrolöre:

$scope.$on('modal.closing', function(event, reason, closed) { 
    console.log('modal.closing: ' + (closed ? 'close' : 'dismiss') + '(' + reason + ')'); 
    var message = "You are about to leave the edit view. Uncaught reason. Are you sure?"; 
    switch (reason){ 
     // clicked outside 
     case "backdrop click": 
      message = "Any changes will be lost, are you sure?"; 
      break; 

     // cancel button 
     case "cancel": 
      message = "Any changes will be lost, are you sure?"; 
      break; 

     // escape key 
     case "escape key press": 
      message = "Any changes will be lost, are you sure?"; 
      break; 
    } 
    if (!confirm(message)) { 
     event.preventDefault(); 
    } 
}); 

ben "iptal" eylemi tetikleyen madenin sağ üst, üzerinde bir kapatma düğmesi var. Zemin üzerine tıklayarak (etkinleştirilmişse) iptal eylemini tetikler. Çeşitli yakın etkinlikler için farklı mesajlar kullanmak için bunu kullanabilirsiniz. Başkaları için yararlı olması durumunda düşünürdüm.