Закрытие Bootstrap 2.3 и UI-Bootstrap в javascript с AngularJS

Question

У меня есть AngularJS с Boostrap 2.3.2 и UI-Bootstrap webapp. У меня есть эта функция, чтобы открыть UI-Bootstrap компонента модального из JavaScript:

$scope.openProcessingBookingModal = function() {   
      var modalInstance = $modal.open({ 
       backdrop: 'static', 
       templateUrl: 'partials/processing-booking-modal.html', 
      }); 

      modalInstance.result.then(function (selectedItem) { 
       $scope.selected = selectedItem; 
      }, function() { 
      }); 
     }; 

Это модальное в партиалах/обработает билетную modal.html:

<div id="processing-modal" class="modal-body text-left alert alert-info" style="border: 0px; padding: 30px !important"> 
    <h3><i class="fa-icon-time"></i> {{'PROCESSING_BOOKING_1' | translate}} 
     <img src="img/spinners/ajax-loader-2.gif" 
      class="img-loader-small" 
      style="margin-left: 1px; vertical-align: inherit;"></img> 
    </h3> 
    <div class="row-fluid" style="margin-top: 10px"> 
     <p>{{'PROCESSING_BOOKING_2' | translate}}</p> 
     <p>{{'PROCESSING_BOOKING_3' | translate}}</p> 
     <p>{{'PROCESSING_BOOKING_4' | translate}}</p> 
    </div> 
</div> 

Функция Я хочу, чтобы открыть и недалеко от:

var CreditCardPayment = function (paymentType) { 


         $scope.openProcessingBookingModal(); 

         Booking.book({id: $scope.id}, function success(result) { 

           $scope.booking = result;                
           $scope.closeProcessingBookingModal(); 

Как я могу закрыть модальный из JavaScript программно в другой функции closeProcessingBookingModal?

Answer 1

Попробуйте это:

$scope.openProcessingBookingModal = function() {   
      var modalInstance = $modal.open({ 
       backdrop: 'static', 
       templateUrl: 'partials/processing-booking-modal.html', 
      }); 
      // capture modal instance 
      $scope.myModalInstance = modalInstance; 

      modalInstance.result.then(function (selectedItem) { 
       $scope.selected = selectedItem; 
      }, function() { 
      }); 
     }; 

// somewhere in same controller 
$scope.closeProcessingBookingModal() { 
    if($scope.myModalInstance) { 
      $scope.myModalInstance.close() 
    } 
} 

Следует отметить, что это требование немного неестественно, так как модальный обычно покрывает весь экран, и он, как правило, закрыты в течение своего собственного контроллера.

Update:

Просто увидел обновленный комментарий по этому вопросу. Я предполагаю, что вариант использования подходит.