angular - 如何在 Valor ngx-bootstrap 选项卡标题中创建一个复选框？

Question

我正在尝试在 Tab-heading 元素中创建一个复选框。元素已创建，但复选框 (cick) 从未被调用，但选项卡已更改。

请参阅https://stackblitz.com/edit/angular-gsaf63?file=src%2Fapp%2Fapp.component.html进行演示（演示正在运行，但未显示正确的 CSS。请参阅控制台的输出） .

我现在的问题是：如何在标题内实现一个复选框，但在单击复选框时不更改选项卡。

感谢您的帮助！

标签： angulartabsngx-bootstrap

Answer 1

尝试使用click事件并停止事件传播

组件.html

<input type="checkbox" [(ngModel)]="isChecked[i]" 
(ngModelChange)="onSelectResult(entry)" 
(click)="onCheckboxChanged($event)" />  <!--  <===== add this -->

组件.ts

onCheckboxChanged(evt)
{
 evt.stopPropagation();
}

修改后的堆栈闪电战