Tengo una lista de botones:

cuando hay desbordamiento, quiero que los botones estén en una lista desplegable como esta:

Y necesito que sea dinámico (reorganizar el cambio de tamaño de página)

Intenté esto:

 ngAfterViewInit() { const width = this.container.nativeElement.offsetWidth; const fittingActions = [...this.container.nativeElement.children]; let fittingActionsWidth = 0; for (const action of fittingActions) { fittingActionsWidth = fittingActionsWidth + action.clientWidth if (fittingActionsWidth < width) { this.actionCountToDisplay = this.actionCountToDisplay + 1 } } }

 <ng-container *ngFor="let action of actionButtons.slice(0, actionCountToDisplay || actionButtons.length)"> <button (click)="action.onClick($event)" mat-flat-button color="primary"> <span>{{action.label}}</span> </button> </ng-container>

pero no funciono bien