ionic-team / ionic-framework

A powerful cross-platform UI toolkit for building native-quality iOS, Android, and Progressive Web Apps with HTML, CSS, and JavaScript.
https://ionicframework.com
MIT License
50.48k stars 13.53k forks source link

bug: ion-radio does not keep checked-state after updating the underlaying object #29442

Closed mariusbolik closed 1 week ago

mariusbolik commented 2 weeks ago

Prerequisites

Ionic Framework Version

v8.x

Current Behavior

Initially, the ion-radio-button is checked correctly. But after updating the objects that contain the data that is used to display the ion-radion-buttons, the checked-state gets lost, even though the value property stays the same. Seems that this bug appears on Angular standalone projects.

Perhaps this error could be related to the following issue: https://github.com/ionic-team/ionic-framework/issues/29414 It could also be that this error can be found in other components, such as ion-accordion.

Expected Behavior

The active ion-radio-button should be highlighted when it's value matches the value of it's containing ion-radio-group - as was the case before standalone components.

Steps to Reproduce

  1. Go to https://stackblitz.com/edit/angular-vquurr-ec7ark?file=src%2Fapp%2Fexample.component.html
  2. Click the "Update Data" Button

Code Reproduction URL

https://stackblitz.com/edit/angular-vquurr-ec7ark?file=src%2Fapp%2Fexample.component.html

Ionic Info

Ionic CLI : 7.2.0 Ionic Framework : @ionic/angular 8.0.1 @angular-devkit/build-angular : 17.3.6 @angular-devkit/schematics : 17.3.6 @angular/cli : 17.3.6 @ionic/angular-toolkit : 11.0.1

Additional Information

No response

mariusbolik commented 2 weeks ago

Same for ion-accordion: https://stackblitz.com/edit/angular-vquurr-6urqjk?file=src%2Fapp%2Fexample.component.html And maybe ion-checkbox, ion-toggle, ion-menu are also affected. Can someone from the Ionic Team whith deeper understanding in code architecture investigate if this bug applies to more components?

thetaPC commented 1 week ago

Thank you for the issue!

I was able to replicate it and wrote up a fix for it. Feel free to test out the dev build:

npm install @ionic/angular@8.1.1-dev.11714760012.1eab947e

thetaPC commented 1 week ago

Thanks for the issue! This has been resolved via PR https://github.com/ionic-team/ionic-framework/pull/29457 and will be available in an upcoming release of Ionic.