Question

您好，我希望标题具有足够的描述性以理解我的问题，

我有这个HTML代码。在<td>中，我附加了一个(click)函数。在此<td>中，我还有另一个div，它也附加了一个(click)函数。当我单击<td>内的按钮时，两个功能都被触发。但是，我只希望在单击div时触发（单击），而不希望触发<td> (click)。有可能发生吗？

<td mat-cell align="center" *ngFor="let option of options; let opt_indx = index"
    (click)="optionsClicked(opt_indx, i);" id="defaultBadge-wrapper">

    <div *ngIf="!rowCommands[i].defaultSelected[opt_indx]" class="defaultBadge">
        <a class="badge badge-secondary" matTooltip="Click here to set this Option as Default"
            (click)="markDefault(i,option.id)">Default</a>
    </div>
</td>

打字稿代码

markDefault(index, option: string) {
    alert('this function triggered');
}

optionsClicked(option, rule) {
    alert('I dont want this function to be triggered when i click markDefault');
}

Answer 1

在ts方法中，将$ event作为参数传递并包含

event.stopPropagation();

或在click事件中传递另一个功能：

(click)="markDefault(i,option.id); event.stopPropagation();">Default</a>

Answer 2

使用stoppropagation阻止事件传播

(click)="markDefault(i,option.id); event.stopPropagation();">Default</a>

Answer 3

只需将MainTaskActivity.myRecyclerView添加到内部点击即可。

$event.stopPropagation()

如何控制一个表中的多个（单击）事件？

3 个答案: