angular - 如何限制（控制） ngx-bootstrap 动态 tabs-angular 2+ 的选项卡数量

Question

我正在使用ngx-bootstrap使用动态选项卡，

我的用户界面流程：

step1 :- 必须使用包含策略、类别和子类别的树表。

step2 :- 点击 Policy 打开类别。

第三步：点击类别打开子类别。

第 4 步：单击类别会打开 ngx-bootstrap 动态选项卡。

这是我的 stackblitz 示例

https://stackblitz.com/edit/angular-hdw4fh?file=src%2Fapp%2Fapp.component.html

问题：-

我必须限制选项卡控件。这意味着我必须打开最多 10 个（不超过 10 个）选项卡。但在这种情况下，标签打开是无限的。

有没有办法限制标签的数量？有谁能够帮我？？

标签： angularangular6angular5ngx-bootstrap

Answer 1

将以下代码添加到开头addNewTab：

if (this.tabs.length == 10) {
  alert("Max 10 tabs");
  return;
}

更新了 stackblitz 示例：
https ://stackblitz.com/edit/angular-homrum?file=src/app/app.component.ts

alert您可以使用 alert 组件代替 browser以ngx-bootstrap获得更好的用户体验：
https ://valor-software.com/ngx-bootstrap/#/alerts