Javascript 角度UI引导模式不覆盖现有模式
我在AngularJS应用程序的Javascript 角度UI引导模式不覆盖现有模式,javascript,angularjs,angular-ui-bootstrap,Javascript,Angularjs,Angular Ui Bootstrap,我在AngularJS应用程序的$rootScope上创建了此alertModal函数。它工作得很好,但是,我需要每个模态覆盖后续模态。换句话说,如果已经有一个模态打开,我希望任何后续模态关闭现有的。我不知道该怎么做,因为每个$modal实例都在$rootScope上创建了一个子范围。$modal中有一个选项,可以将要使用的范围传递给它(而不是$rootScope),但我不确定如何仅为此目的实例化自定义范围。任何帮助或线索都会很好 $rootScope.modalAlert = function
$rootScope
上创建了此alertModal函数。它工作得很好,但是,我需要每个模态覆盖后续模态。换句话说,如果已经有一个模态打开,我希望任何后续模态关闭现有的。我不知道该怎么做,因为每个$modal
实例都在$rootScope
上创建了一个子范围。$modal
中有一个选项,可以将要使用的范围传递给它(而不是$rootScope
),但我不确定如何仅为此目的实例化自定义范围。任何帮助或线索都会很好
$rootScope.modalAlert = function (alert_type, message, acknowledge) {
return $modal.open({
templateUrl: '/partials/modals/alert.html',
controller: AlertModalInstanceCtrl,
resolve: {
data: function () {
return {
type: alert_type,
message: message,
acknowledge: acknowledge || false
}
}
}
})
}
var AlertModalInstanceCtrl = function ($scope, $modalInstance, data) {
var heading = ''
switch (data.type) {
case 'error':
heading = 'Oops'
break
case 'working':
heading = 'Working'
break
}
$scope.alert = {
type: data.type,
heading: heading,
message: data.message,
acknowledge: data.acknowledge
}
$scope.cancel = function () {
$modalInstance.dismiss('cancelled');
};
}
不太相关,但以下是附带的HTML模板:
<div class="row">
<div class="col-sm-12">
<h2 class="modal-header">{{ alert.heading }}</h2>
<div class="modal-body">
<div style="text-align: center;">
<i ng-class="{
'fa fa-exclamation-triangle fa-5x danger': alert.type=='error',
'fa fa-info fa-5x info': alert.type=='working'
}"></i>
<p>{{ alert.message }}</p>
</div>
<button ng-show="alert.acknowledge" class="btn btn-default pull-right" ng-click="cancel()">Ok</button>
</div>
</div>
</div>
{{alert.heading}
{{alert.message}
好啊
看起来是$broadcast
的一个很好的用例:
$rootScope.modalAlert = function (alert_type, message, acknowledge) {
$rootScope.$broadcast('modal:start-open');
return $modal.open({
...
然后在控制器中:
var AlertModalInstanceCtrl = function ($scope, $modalInstance, data) {
$scope.$on('modal:start-open', function() {
$modalInstance.dismiss('cancelled');
});
...