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

Question

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

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

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

感谢您的帮助！

Answer 1

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

component.html

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

component.ts

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

Modified stackblitz

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

How to create a checkbox in Valor ngx-bootstrap tab heading?

tabs

ngx-bootstrap

angular