AngularJS指令:如何隐藏使用超时警报?

编程入门 行业动态 更新时间:2024-10-28 16:16:28
本文介绍了AngularJS指令:如何隐藏使用超时警报?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧! 问题描述
  • 昨天,我开始写一个的通知指令我的项目
  • 我问的问题计算器 AngularJS:警报显示不出来并通过后挣扎文件和视频,我能够建立一个基本的通知指令plnkr.co/edit/uqSB1gIz6XEmJfC8zHNb?p=$p$pview
  • Yesterday, I started writing a notification directive for my project
  • I asked question on stackoverflow AngularJS: Alerts not showing up and after struggling through documents and videos, I am able to build a basic notification directive plnkr.co/edit/uqSB1gIz6XEmJfC8zHNb?p=preview

我要什么?

像任何其他应用程序,当警报显示出来,他们一秒钟后隐藏或因此,我试图找出一种方法来隐藏秒后报警,但不知道该怎么做。

Like any other app, when alerts show up, they hide after a second or so, I am trying to find out a way to hide the alert after a second, but not sure how to do that

任何帮助是极大AP preciated

Any help is greatly appreciated

更新

根据@德里克的回答,我能够实现超时结果plnkr.co/edit/uqSB1gIz6XEmJfC8zHNb?p=$p$pview

As per @Derek's answer, I am able to implement timeout plnkr.co/edit/uqSB1gIz6XEmJfC8zHNb?p=preview

推荐答案

一般来说,我会实现与阵列,是推动新的通知入堆栈的通知,然后设置一个$超时从数组中删除特定元素。在渲染方面,你只想用一个NG-中继器。

Generally I would implement notifications with an array, that pushes new notifications onto the stack, then sets a $timeout that removes that particular element from the array. On the rendering side you would just use an ng-repeater.

不过你的情况,如果你想保持现有的指令,你可以只需添加一个链接功能和设置$超时要删除的元素完成此功能。

However in your case, if you want to keep your existing directive you could accomplish this functionality by just adding a linking function and setting a $timeout to remove the element.

app.directive('notification', function($timeout){ return { restrict: 'E', replace: true, scope: { ngModel: '=' }, template: '<div class="alert fade" bs-alert="ngModel"></div>', link: function(scope, element, attrs){ $timeout(function(){ element.remove(); }, 5000); } } });

更多推荐

AngularJS指令:如何隐藏使用超时警报?

本文发布于:2023-11-27 17:05:51,感谢您对本站的认可!
本文链接:https://www.elefans.com/category/jswz/34/1638861.html
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系,我们将在24小时内删除。
本文标签:警报   指令   AngularJS

发布评论

评论列表 (有 0 条评论)
草根站长

>www.elefans.com

编程频道|电子爱好者 - 技术资讯及电子产品介绍!