Angular.js でng-clickのイベント伝播を停止する方法

イベントハンドラng-clickを設定したオブジェクトが重なっている場合、重なった部分をクリックすると手前のオブジェクトから順にイベントが発火しますが、その伝搬を途中で止めたいときの方法です。

<button ng-click="btnClick($event)">クリック</button>

このボタンのイベントハンドラに以下のコードを追加すれば、このボタンクリック以降のイベント伝搬が止まります。

$this.btnClick = function($event) {
    $event.stopPropagation();
    $event.preventDefault();
}

橋本 たかし

ホームページの制作（デザイン・コーディング・プログラミング）に加え、ネットショップの販売促進に関するアドバイスも致します。 20年以上に渡って実際にネットショップを運営した経験を生かし、聞きかじりではない実績を伴ったノウハウを、自分の言葉でお伝えいたします。 プログラミングの経験は30年以上。HTML、CSS、JavaScript、TypeScript、Vue、NuxtJS、Node.js、MySQL、MongoDB、Elasticsearch、WordPress、PHP、Docker、Electronなど、幅広く対応します。

bagooon.com