为什么内的函数调用运行第一比母体函数调用角2

我有两个功能，第一个是myFunction的（）和myDiv（）为什么内的函数调用运行第一比母体函数调用角2

<div (click)="myDiv()"> 
    <button (click)="myFunction()"> Submit </button> 
</div>

在AppComponent我有这两种功能的认定中像这样：

myFunction() 
{ 
    console.log("I am in myFunction"); 
} 

myDiv() 
{ 
    console.log("I am in myDiv"); 
}

这样做的结果应该是：

我在myFunction的

我在myDiv

为什么myFunction在myDiv之前先运行？是什么原因？

来源

2017-11-18 kappo

原因是这是事件如何传播。阅读关于此https://developer.mozilla.org/en-US/docs/Web/API/Document_Object_Model/Examples#Example_5:_Event_Progagation – dfsq

这是因为click事件冒泡

<html>(document)            
                 /\ 
    <div (click)="myDiv()">        || 

                 /\ 
    <button (click)="myFunction()"> Submit </button> || 
    </div>

参见

https://www.quirksmode.org/js/events_order.html

如果你想myDiv处理程序先叫你应该赶在捕捉事件阶段

el.addEventListener('click', myDiv, true); 
            \/ 
            useCapture

AFAIK角度不支持useCapture选项。这里是一个workaround

来源

2017-11-18 10:05:28 yurzui

我不明白我怎么可以在我的代码中添加useCapture 我已经添加ElementRef和渲染器 – kappo

我已将示例添加到我的答案 – yurzui

我在修改我的代码后出现此错误：将代码放入ngAfterViewInit（）后无法读取nativeElement的undefined属性为null – kappo

为什么内的函数调用运行第一比母体函数调用角2

回答

相关问题