代码之家 › 专栏 › 技术社区 › Riples

角带警报:警报时无法捕获。hide()触发器

angular-strap alert angularjs

Riples · 技术社区 · 10 年前

我正在尝试使用Angular Strap和 $alert 服务然而,到目前为止,一切都很好,我有一个问题似乎无法解决。

是否可以设置回调以捕获 $警报 使用 duration 属性或 alert.hide() 命令我想在警报进入隐藏状态时运行一个函数。

我的代码片段如下:

var alertContent = '';


        // Define the critical alert
        var criticalAlert = $alert({
                            templateUrl: 'templates/critical.alert.tpl.html',  
                            title: ' Critical Alert Detected!', 
                            content: alertContent, 
                            container: 'body', 
                            type: 'danger', 
                            dismissable: false, 
                            duration: '20', 
                            show: false
                        });

...

alertContent = 'Foo Bar!';

...

criticalAlert.$promise.then(criticalAlert.hide);

...

$scope.$on('alert.hide', function() {
            console.log('Alert Hidden');
        });

1 回复 | 直到 10 年前

Stepan Kasyanenko 10 年前

结果 $promise ,您可以传递自己的函数,例如:

criticalAlert.$promise.then(function(){criticalAlert.hide();console.log('Alert Hidden'); })

更多关于 $承诺 anglular $q

更新

您可以使用 $watch .

当然,这不是一个好的解决方案,但却是我找到的最好的解决方案。至少,它有效!

var alert = $alert({
  title: ' Critical Alert Detected!',
  content: 'its Alert!',
  container: 'body',
  type: 'danger',
  dismissable: false,
  duration: '5',
  show: false,
});
$scope.$watch(function(){return alert.$isShown;},function(val){
  if(val===true)
    console.log('alert opened',val);
  else
    console.log('alert closed',val);
});
alert.$promise.then(alert.show);

更新2

我们可以使用 event 角度。

现场示例 jsfiddle .

.controller('ExampleController', function($scope, $alert) {
$scope.alert = $alert({
  title: ' Critical Alert Detected!',
  content: 'its Alert!',
  container: '#divForAlert',
  type: 'danger',
  dismissable: false,
  duration: '5',
  show: false,
  prefixEvent:"mymodal",
});
$scope.alert.$promise.then(function() {
  $scope.alert.show();
});
$scope.$root.$on('mymodal.hide.before', function(event) {
  console.log('hide before',event);
});
 $scope.$root.$on('mymodal.hide', function(alert) {
  console.log('hide',alert);
});});

还有一些 重要的 html语言

<div ng-controller="ExampleController">
<h3>
  ExampleController
</h3>
<form name="ExampleForm" id="ExampleForm">
  <div id="divForAlert">

  </div>
</form>

推荐文章

learner · 如果超出限制,AngularJS ui select multiple应显示警报

4 年前

Onyx · 外部和内部div都有ng click,当我单击内部div时,两个ng click都会执行。如何预防?

4 年前

Michlut · Angular JS——从表单上传文件,并作为json对象的一部分与其他数据一起发送

4 年前

jieunbi · 按日期排序数组(最新优先)

4 年前

StackoverflowNinja · 当数字框的值在AngularJS中更改时更改下拉列表的值

4 年前

Stradosphere · 如何防止ng bind html添加结束标记?

8 年前

Celestialchippy · 如果事情是真的,如何创建一个“<a>”链接?

8 年前

a4aravind · Angulari如何使用java驱动程序访问元素?

8 年前

Nicoleta Wilskon · DecodeURIComponent不支持%uxxx编码的组件

8 年前

Nishant Florentin · 在AngularJS中发生ng if、ng show等之后,我该如何做一些动作?

8 年前