如何限制（控制）ngx-bootstrap dynamic tabs-angular 2+的標簽數量

Question

我正在使用ngx-bootstrap動態標簽，

我的用戶界面流程：

step1 :- 必須使用包含策略、類別和子類別的樹表。

步驟 2 :- 單擊 Policy 打開類別。

step3 ：點擊類別打開子類別。

步驟 4 ：點擊類別打開 ngx-bootstrap 動態選項卡。

這是我的 stackblitz 示例

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

問題：-

我必須限制選項卡控件。 這意味着我必須打開最多 10 個（不超過 10 個）的選項卡。 但在這種情況下，選項卡打開將不受限制。

有沒有辦法限制tab的數量？？ 有誰能夠幫助我？？

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

您可以使用ngx-bootstrap的 alert 組件代替瀏覽器alert以獲得更好的用戶體驗：
https://valor-software.com/ngx-bootstrap/#/alerts