角度-按鈕點擊事件優先於行點擊事件

Question

有了一個包含行的表格，我可以單擊一行以通過單獨的頁面訪問一行的詳細信息。 這是通過[routerlink]完成的。

 <tr *ngFor="let setting of applicatieData.settings" [routerLink]="['/settings-edit', setting.id]">
    <td class="col-3">{{ setting.shortName | slice:0:10 }}</td>
    <td class="col-4">{{ setting.value }}</td>
    <th class="col-3"><button class="btn btn-info" type="button" (click)="toggleValue(setting.id)">Toggle</button></th>
    <td class="col-2" (contextmenu)="onrightClick($event, setting.id)"><i class="icon-ellipsis-vert"></i></td>
</tr>

我希望“切換”按鈕單擊事件比前面提到的行單擊事件具有更高的優先級。 我怎樣才能做到這一點？

右鍵單擊“上下文菜單”可以正常工作。

Answer 1

您需要阻止事件使dom樹冒起。

<th class="col-3"><button class="btn btn-info" type="button" (click)="toggleValue($event, setting.id)">Toggle</button></th>

toggleValue(event: MouseEvent, id: string) {
  event.preventDefault();
  event.stopPropagation();

  ...
}

Answer 2

你可以試試看

 <tr> <td class="col-3" (click)="clickFila()">1</td> <td class="col-4" (click)="clickFila()">2</td> <th class="col-3" (click)="clickFila()">3</th> <td class="col-2"(click)="clickColumna()">4</td> </tr>