AngularJS-Закрытие Модального Окна

мои включает в себя:

bootstrap.css [ getbootstrap.com/2.3.2 ]
angular/ui-bootstrap-tpls-0.10.0.min.js from: [ angular-ui.github.io/bootstrap ]

Я использую AngularJS и Twitter Bootstrap.

из AngularJS я открываю модальное окно следующим образом:

var modalInstance = $modal.open({
              templateUrl: 'resources/html/mymodal.html',
              controller: 'mymodalController',
              scope: $scope
            });

мой модальный шаблон:

<div class="modal">
<
  <div class="modal-header">
    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button> 
  </div>
.....
</div>


вопрос:
Кнопка Закрыть [x] не работает
Когда я нажимаю на него, модальное не уходит. Но когда я нажимаю Esc-модальный исчезает.
Так выглядит ... data-dismiss= "modal" не работает. Есть идеи?

3 ответов


на data-dismiss атрибут используется загрузочным javascript (как я вижу, вы получили исходный код html из,http://getbootstrap.com/javascript/#modals)

UI Bootstrap не будет привязываться к этой кнопке закрытия, потому что он не ищет этот атрибут, вам нужно добавить ng-click и отклонить модальный, как в примерах

http://angular-ui.github.io/bootstrap/#/modal

in контроллер:

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

модальные шаблон...

<button class="btn btn-warning" ng-click="cancel()">Cancel</button>

в угловой, есть close метод $modalInstance закрыть открытое модальное окно .

:
  $scope.closeMyPopup = function () {
    $modalInstance.close();
  };

Я сделал это таким образом, используя jQuery с Angular:

jQuery('#YOURMODALID').modal('hide');