//指令定义

@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. 8 Django模型层(1)

    知识预览 ore简介 单表操作 章节作业 ore简介 MVC或者MVC框架中包括一个重要的部分,就是ORM,它实现了数据模型与数据库的解耦,即数据模型的设计不需要依赖于特定的数据库,通过简单的配置就可 ...

  2. 数据库-SqlServer 行转列,列转行

    两篇行转列,列转行的实例文章: 第1篇:https://www.cnblogs.com/cpcpc/archive/2013/04/08/3009021.html 第2篇:https://mp.wei ...

  3. OGG-DDL复制

    http://blog.sina.com.cn/s/blog_96d348df0102vg6q.html OGG目前只支持Oracle和TeraData的ddl复制,Oracle数据库能够支持除去数据 ...

  4. postgresql_action

    SELECT * FROM x123_area a LEFT JOIN x123_user_task_brief utb ON utb.ref_area_code = a.area_code WHER ...

  5. 关于问题的四个单词区别: question problem matter issue

    [[ 网上讨论的 problem, question, issue, matter这些名词均含"问题"之意.problem: 指客观上存在的.难以处理或难以理解的问题.questi ...

  6. Vue实现音乐播放器(四):页面入口+header组件的编写

    首先下载三个包 babel-runtime对es语法进行转义 fastclick解决移动端点击300毫秒延迟的问题 babel-polyfill对es6 api进行转义 下载了包之后要在main.js ...

  7. HAWQ技术总结

    HAWQ技术总结: 1. 官网: http://hawq.incubator.apache.org/ 2. 特性 2.1 sql支持完善 ANSI SQL标准,OLAP扩展,标准JDBC/ODBC支持 ...

  8. dvorak键盘布局调整

    一站直达: http://www.kaufmann.no/roland/dvorak/

  9. 解锁 HTTPS原理

    From今日头条:https://www.toutiao.com/a6534826865792647693/?tt_from=weixin&utm_campaign=client_share& ...

  10. 20191023 XXL-JOB

    概述 XXL-JOB是一个轻量级分布式任务调度平台,其核心设计目标是开发迅速.学习简单.轻量级.易扩展.现已开放源代码并接入多家公司线上产品线,开箱即用. 文档地址: 官方文档 文档写的很详细,参考着 ...