指令与点击监听器，并在Angular2

<a appMenuDropDown (click)="getSubMenuItems(menuItem)"> 
....... 
</a>

当一个元素有一个指令（appMenuDropDown）监听点击事件和点击事件处理程序，会发生什么点击相同的元素事件（getSubMenuItems（））？哪个处理程序首先被触发？处理程序中的指令或getSubMenuItems（）？指令与点击监听器，并在Angular2

@HostListener('click') 
clickListener() { 
    let sourceElement = this.el.nativeElement; 
    .... 
}

来源

2016-12-07 Raja Vengala

我认为元素的事件会先被触发。你可以简单地使用'console.log'，看看...... – Dimanoid

我认为，在指令中的情况下HostListener将永远烧制的第一

您可以在generateHandleEventMethod方法看一看编译器内从源代码

directives.forEach((dirAst, dirIdx) => { 
    ... 
}); 
boundEvents.forEach((renderEvent, renderEventIdx) => { 
    ... 
});

https://github.com/angular/angular/blob/2.2.4/modules/%40angular/compiler/src/view_compiler/event_binder.ts#L92-L115

，这里是生成元件。生产厂家

View_AppComponent0.prototype.handleEvent_4 = function(eventName,$event) { 
    var self = this; 
    self.debug(4,2,4); 
    self.markPathToRootAsCheckOnce(); 
    var result = true; 
    result = (self._AppMenuDropDownDirective_4_3.handleEvent(eventName,$event) && result); 
    if ((eventName == 'click')) { 
    var pd_sub_0 = (self.context.getSubMenuItems() !== false); 
    result = (pd_sub_0 && result); 
    } 
    return result; 
};

Demo

来源

2016-12-07 11:41:33 yurzui

在我所有的测试中，它确实是指令处理程序。我不确定它是否按照特定顺序编程。感谢您的演示和编译的代码。 –

事件处理程序的顺序是显式未定义的。另外，如果您对元素有多个指令，则它们添加的顺序对处理事件处理程序的顺序不重要。

来源

2016-12-07 11:22:06

指令与点击监听器，并在Angular2

回答

相关问题