Ionic 7 with Angular makes only UI changes when Debbuger ist runing

I have an ion-select which should contain an ion-icon at the end. The icon should change depending on whether the ion-select is open or closed.
Problem:
My icon changes correctly when the ion-select is open but no longer when the ion-select is closed. Strangely enough, when I debug the behaviour, the ion-icon changes correctly both when closing and opening.

<ion-list lines="none">
      <ion-list-header class="header">{{'category' | translate }}</ion-list-header>
      <ion-item>
        <ion-select placeholder="{{'categoryFilter' | translate }}" interface="popover" (ionFocus)="setToggleIcon()" (ionDismiss)="setExpandIcon()" >
          <ion-select-option  *ngFor="let category of [1,2,3]; index as i">Apfel {{i}}</ion-select-option>
        </ion-select>
        <ion-icon class="toggleIcon" name="{{toggleIcon}}"></ion-icon>
      </ion-item>
      <hr class="border">
      </ion-list>



@Component({
  selector: 'app-maintenance-list',
  templateUrl: './maintenance-list.component.html',
  styleUrls: ['./maintenance-list.component.scss'],
})
export class MaintenanceListComponent  implements OnInit {
  protected toggleIcon:string = "chevron-down-outline";
  constructor() {
  }
  ngOnInit() {}

  setToggleIcon(): void {
    this.toggleIcon = 'chevron-up-outline';
  }

  setExpandIcon(){
    this.toggleIcon ="chevron-down-outline"
  }
}

Thank you for your help