//指令定义

@Directive({

  selector: `click-stop-propagation`

  events: 'stopClick($event)'

})

class ClickStopPropagation {

  stopClick(event:Event) {

    event.preventDefault();

    event. stopPropagation();

  }

}
//使用

<button (click)="doSomething()" click-stop-propagation>

参考:

https://github.com/angular/angular/issues/2042

Angular 一个简单的指令实现 阻止事件扩散的更多相关文章

  1. angular学习笔记(三十)-指令(9)-一个简单的指令示例

    学了前面这么多关于指令的知识,现在就用指令来写一个小组件:expander 这个组件的功能就是点击开展菜单,再点击收起菜单: ↑↓点击展开收起 下面来看它的代码: html: <!DOCTYPE ...

  2. jQuery阻止事件冒泡的例子

    下面给给各位朋友稍加整理了一jquery中阻止事件冒泡的一些例子,我们知道JQuery 提供了两种方式来阻止事件冒泡,但我们简单的利用它来做一些应用可能不深入或不理解,下面整理了更详细的方法,有兴趣的 ...

  3. 使用lua实现一个简单的事件派发器

    设计一个简单的事件派发器,个人觉得最重要的一点就是如何保证事件派发过程中,添加或删除同类事件,不影响事件迭代顺序和结果,只要解决这一点,其它都好办. 为了使用pairs遍历函数,重写了pairs(lu ...

  4. Qt使用一个事件队列对所有发出的事件进行维护（QObject的event()函数相当于dispatch函数），用EventLabel 继承QLabel作为例子（简单明了） good

    事件(event)是由系统或者 Qt 本身在不同的时刻发出的.当用户按下鼠标.敲下键盘,或者是窗口需要重新绘制的时候,都会发出一个相应的事件.一些事件在对用户操作做出响应时发出,如键盘事件等:另一些事 ...

  5. javascript的事件冒泡,阻止事件冒泡和事件委托， 事件委托是事件冒泡的一个应用。

    首先,弄明白js 当中,什么是事件,事件模型在js中是如何设计的.什么是事件冒泡? 什么是“事件冒泡”呢?假设这里有一杯水,水被用某种神奇的方式分成不同颜色的几层.这时,从最底层冒出了一个气泡,气泡会 ...

  6. angularjs中阻止事件冒泡，以及指令的注意点

    appModule.directive('newStr',function(){ return{ restrict:'AE', //阻止事件冒泡需要加$event参数 template:`<di ...

  7. 并发编程概述 委托（delegate） 事件（event） .net core 2.0 event bus 一个简单的基于内存事件总线实现 .net core 基于NPOI 的excel导出类，支持自定义导出哪些字段 基于Ace Admin 的菜单栏实现 第五节：SignalR大杂烩(与MVC融合、全局的几个配置、跨域的应用、C/S程序充当Client和Server)

    并发编程概述   前言 说实话,在我软件开发的头两年几乎不考虑并发编程,请求与响应把业务逻辑尽快完成一个星期的任务能两天完成绝不拖三天(剩下时间各种浪),根本不会考虑性能问题(能接受范围内).但随着工 ...

  8. 构建一个简单的Angular工程

    1.创建一个空的工程,之后用webstorm打开,添加一个bower.json文件: { "name": "AngularTpl", "depende ...

  9. Java实现一个简单的事件监听器

    关于事件监听我们需要知道的一些基础知识. a)事件三要素(who when what): source -- 事件源 when -- 事件发生时间 message -- 事件主题消息,即希望通过事件传 ...

随机推荐

  1. spring MVC junit单元测试 各test之间共享变量

    使用静态变量   private static String iPSetCode=null;

  2. JDBC之Statement 接口的测试（存在sql注入风险）

    实现简单的登录功能 import java.sql.Connection; import java.sql.DriverManager; import java.sql.ResultSet; impo ...

  3. iOS即时通讯之CocoaAsyncSocket源码解析五

    接上篇:iOS即时通讯之CocoaAsyncSocket源码解析四         原文 前言: 本文为CocoaAsyncSocket Read篇终,将重点涉及该框架是如何利用缓冲区对数据进行读取. ...

  4. 练习2：python-把excel表格中某张表的内容导入sqlite

    前言:最新需要用到大批量的数据,在excel造好数据之后,存储在数据库库中,方便调用数据,于是就想着用python语言写一下这个过程 python有个openpyxl的模块,可以直接用来对于excel ...

  5. shader例子

    1.水波涟漪:https://zhuanlan.zhihu.com/p/47204844 2.shaderToy转unity: https://zhuanlan.zhihu.com/p/5228708 ...

  6. PAT 1001 A+B Format (20 point(s))

    题目: 我一开始的思路是: 用math.h中的log10函数来计算位数(不建议这么做,因为会很慢,而且会出一点别的问题): 用pow函数根据要插入分号的位置来拆分a+b成一个个数字(例如res / p ...

  7. 信息收集【采集点OWASP CHINA】网址http://www.owasp.org.cn/

    以下部分源于 安全家 http://www.anquanjia.net.cn/newsinfo/729480.html 资源虽多,优质却少.不要被信息海迷惑的心智,新人要想入门,除了优质的系统教学资源 ...

  8. 为什么说 Babel 将推动 JavaScript 的发展【转】

    Babel是一个转换编译器,它能将 ES6 转换成可以在浏览器中运行的代码.Babel 由来自澳大利亚的开发者Sebastian McKenzie创建.他的目标是使 Babel 可以处理 ES6 的所 ...

  9. oracle--序列&视图&索引&视图&可视化操作&分页&数据库备份

    --oracle学习内容--oracle的管理系统学习--oracle的数据管理学习--oracle的用户管理--oracle二维表管理--oracle的其他知识 --oracle的序列.视图.索引 ...

  10. python基础-7.2文件内置属性__doc__ __file__ __package__ __cached__ __name__

    __doc__ #py文件开头的注释文字 __file__ #当前py文件的路径 __package__ #包含文件所在包,用 . 分隔,当前文件为None,导入的其他文件:指定文件所在包,用.分隔. ...