Настройка кнопки закрытия модального

Question

я использовал в контроллере modal angular strap, как показано в следующем:

$scope.modal = $modal({ 
    scope: $scope, 
    title: 'My Title', 
    content: text, 
    html: true, 
    contentTemplate: 'views/partials/myTemplate.html', 
    show: true, 
    keyboard: false, 
    backdrop: "static" 
}); 

мне нужно настроить действие кнопки закрытия в верхней части модальным по следующему изображению: .

Как перезаписать действие закрытия верхней кнопки?

Answer 1

Вы можете установить шаблон для модального, или дать модальной идентификатор и использовать CSS.

<!-- You can use a custom html template with the `data-template` attr --> 
<button ... data-template="modal/docs/modal.demo.tpl.html" ... 

HTML

<div class="modal" tabindex="-1" role="dialog"> 
    <div class="modal-dialog"> 
    <div class="modal-content"> 
     <div class="modal-header" ng-show="title"> 
     <button type="button" class="close" ng-click="$hide()">&times;</button> 
     <h4 class="modal-title" ng-bind-html="title"></h4> 
     </div> 
     <div class="modal-body" ng-show="content"> 
     ... 
     </div> 
     <div class="modal-footer"> 
     <button type="button" class="btn btn-default" ng-click="$hide()">Close</button> 
     <button type="button" class="btn btn-primary" ng-click="$hide()">Save changes</button> 
     </div> 
    </div> 
    </div> 
</div> 

Там вы можете настроить кнопки, как вы хотите. Альтернативно хороший способ просто удалить его без добавления нового шаблона - это добавить id в модальный и скрыть кнопку закрытия с помощью css.

Javascript

$scope.modal = $modal({ 
    ... 
    id: 'noCloseButton' 
}); 

CSS

#noCloseButton > .close { display: none; } 

Answer 2

Создайте ваш шаблон и оставьте кнопку ng-click="$hide()" на этой кнопке.

См ссылку в документации по template вариант, который будет использоваться точно так же, как вы используете contentTemplate