角度：绘制后测量按钮和设置属性

Question

我有一个场景，我正在显示一系列按钮。如果屏幕不足以显示按钮，我会显示一个组合框。

感兴趣的模板代码：

<div *ngIf="useDropdown" ngbDropdown>drop down code...</div>
<button *ngFor='let btn of buttons'>{{btn.title}}</button>

感兴趣的组件代码：

public useDropdown:boolean;

ngAfterViewInit() {       
  this.useDropdown = this.isDropdownNeeded();//returns a boolean 
}

所以我的想法是，一旦在屏幕上绘制按钮，我就会测量（在isDropdownNeeded方法中）是否有足够的空间用于按钮。然后返回绑定到ngIf的布尔值以显示或隐藏组合框。如果是这种情况，isDropdownNeeded（）也会删除按钮。

问题是我得到了ExpressionChangedAfterItHasBeenCheckedError。这是由当前周期结束前代码更新useDropdown的值引起的。

我尝试使用setTimeOut，这使按钮显示片刻并在显示组合框之前闪烁。视觉上不优雅......

然后我尝试了：

ngAfterContentChecked() {
    this.useDropdown = this.isDropdownNeeded();
}

这有效，但它一直被调用。我可以设置一个机制来至少停止isDropdownNeeded（）以便一直调用，但是应用程序的某些部分经常会获得数据更新，这会变得很昂贵......

一旦完成绘图，我发现了一些伪造ngFor事件的方法，但它们都没有真正起作用。

那么，如何在绘制按钮后测量一组按钮宽度，以便在不获取ExpressionChangedAfterItHasBeenCheckedError的情况下设置模板属性？