.button-inner height of previously rendered buttons does not update when height changes


#1

I have an array of ion-buttons that I get with this code:

    <button *ngFor="let freq of getFrequencies()"
            ion-button
            [disabled]="isDisabled($event)"
            (click)="onButtonClick(freq)"
            class="my-button">
            [ngClass]="{
            'little-buttons': config.buttonType=== buttonType.little,
            'big-button': config.buttonType === buttonType.big
            }"
          <span>{{freq.name}}</span>

    </button>

this renders in:

image

When my array is updated (I update it using array.filter()) and I get more buttons I change the class with [ngClass] and the buttons are not so big.

The problem is that the buttons that were previously rendered keep their content (.button-inner) with a wrong height:
image

If I manually change the text using Chrome’s inspector the buttons updates correctly.

What I am missing? Is there a way to fix this?