* ng創建標簽時的角度2 - 表達式在選中后發生了變化

Question

我正在使用這里解釋的選項卡項目： Tabs Project

除了我的問題之外的其他所有問 目前唯一對我不起作用的是在創建標簽時應用*ngFor 。

我知道通過角度進行的第二階段檢查會發生變化，而他是對的，在第二階段檢查正在進行時，標簽可能會添加。

我想要做的是盡量讓它工作，在tabs選擇器中使用*ngFor對我來說非常重要。

提供了一個Plunker代碼，展示了崩潰以及我正在努力實現的目標。

Plunker代碼

重要的是，我調查了一下

我明白它只是在調試模式和回答者所說的，雖然它是在一年前。

此外

與能夠在控制台中運行錯誤代碼的Plunker（這是問題的解釋）不同，我甚至無法在項目中切換選項卡，但這是正常的行為，我不想要錯誤的代碼。

不幸的是，我無法分享我的真實代碼，因為它基本上用於我的工作，但是如果需要我可以提供更多數據，盡管它幾乎100％來自Plunker和我在問題開始時提供的項目。。

Answer 1

一種解決方案是使用setTimeout包裝“區域”代碼（手動觸發更改檢測的其他方法也可以）

if(activeTabs.length === 0) {
      setTimeout(()=>{
        this.selectTab(this.tabs.first);
      },0);
}

完整的plunker： https ：//plnkr.co/edit/UVfiJFYexgua2HfPe0Lw ？ p = preview

Answer 2

為了解決此問題，您需要刪除用於將第一個選項卡設置為從ngAfterContentInit（）方法激活的代碼。 此代碼導致此問題：

if(activeTabs.length === 0) {
  this.selectTab(this.tabs.first);
}

我假設錯誤彈出，因為更改檢測要求DOM在一次運行后穩定，並且您在ngAfterContentInit（）中的調用將需要CD的通過傳遞以反映DOM中的新tab.active值。

相反，您可以將* ngFor中的第一個元素設置為默認處於活動狀態。 就像是：

<tab *ngFor="let item of ['1','2']"; let index = index" [active]="index == 0"...

編輯：似乎你也可以使用第一個局部變量（沒有嘗試過）。 看到這個plunkr