//指令定义

@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. Mybatis,模糊查询语句,以及传参数的正确写法

    不多说直接上代码! 接口: public interface CommodityMapper { int deleteByPrimaryKey(Integer productId); int inse ...

  2. Mac sublime安装package controller

    https://packagecontrol.io/installation#st2  链接被墙了这个. 我拿来放在这里. The simplest method of installation is ...

  3. Linux内核调试方法总结之ddebug

    [用途] Linux内核动态调试特性,适用于驱动和内核各子系统调试.动态调试的主要功能就是允许你动态的打开或者关闭内核代码中的各种提示信息.适用于驱动和内核线程功能调试. [使用方法] 依赖于CONF ...

  4. 主流架构 : MVP

    1 背景 MVC 平时开发APP时会发现,activity职责非常重.以MVC角度来看: M:model数据操作层(网络请求,耗时操作,数据存取,其他逻辑操作) V:view,指xml布局文件,其实并 ...

  5. 20170809--JS操作Select备忘

    // 1.判断select选项中 是否存在Value="paraValue"的Item function jsSelectIsExitItem(objSelect, objItem ...

  6. MVC 源码系列之控制器执行(一)

    控制器的执行 之前说了Controller的激活,现在看一个激活Controller之后控制器内部的主要实现. public interface IController { void Execute( ...

  7. Python笔记(二十五)_魔法方法_描述符

    描述符的属性方法 __get__(self, instance, owner): 用于访问属性,返回属性的值 __set__(self, instance, value): 用于给属性赋值时,返回属性 ...

  8. Makefile之patsubst

     经常要手写项目的Makefile,或者看其他项目的遗留项目的Makefile,有些makefile内置函数常用, 却用完就忘记了,最近项目中使用patsubst,感觉挺好用的     格式:$(pa ...

  9. 工具 - VNC

    安装 ubuntu下vnc客户端的安装命令sudo apt-get install xtightvncviewer 重置密码 cd /root/.vnc/ rm -rf passwd vncserve ...

  10. xmake v2.1.9版本发布,增加可视化图形菜单配置

    此版本主要增加xmake f --menu实现用户自定义图形菜单配置,界面风格类似linux的make menuconfig: [图片上传失败-(image-505bc0-1517795319124) ...