angular / angular/components

Radio Button with object as value uncheckes on reset/setvalue/patchvalue

Offen
#13,432 13 Kommentare 1 Reaktion 0 zugewiesene Personen Auf GitHub ansehen
area: material/radio P4
Vorherrschende Sprache
TypeScript
Sterne
25k
Forks
6.8k
Ø Merge
1 T. 8 Std.
Gemergte PRs (30 T.)
91

Beschreibung

#### Bug, feature request, or proposal:
Bug

#### What is the expected behavior?
Just read the next part it will become obvious.

#### What is the current behavior?
When using objects as the value for MatRadioGroup and MatRadioButton the current implementation lacks a `compareWith` property like the current implementation of MatSelect. Normally the radio button will only do a reference based comparison of the value compared to the radio groups value to see if a button should be checked. This is an issue because I am using an API to get the values for the radio group and buttons this interferes with this way of doing a comparison.

However MatRadioButton does have a property called `checked` which I can use. I wrote my own compare method and have it check the current value of the MatRadioGroup with the current value of the MatRadioButton and return true to set the `checked` state of the radio button.

When I use `reset(value)`, `setValue(value)`, or `patchValue(value)` or click on a radio to change the value of the MatRadioGroup, everything works. However performing this twice with the same object results in the radio being unchecked.

#### What are the steps to reproduce?
https://stackblitz.com/edit/angular-material-radio-not-checked-bug

Press the set button twice.
OR
Press the set button then press the reset button twice
OR
Change the selected radio by clicking on a new option and then press the reset button twice
OR
Do not change anything and right away (after a fresh page load) press the reset button

#### What is the use-case or motivation for changing an existing behavior?
Allowing me to use objects or arrays with MatRadioGroup/MatRadioButton while preserving the functionality of a simple reset button for my form.

#### Which versions of Angular, Material, OS, TypeScript, browsers are affected?
material 5 and 6

#### Is there anything else we should know?
This may be related to:
https://github.com/angular/material2/issues/11368

I also think that this feature request would also help potentially fix this issue depending on implementation:
https://github.com/angular/material2/issues/10495

Beitragsleitfaden

Beitragsleitfaden öffnen

Rechercherichtung

Beginne mit der verknüpften StackBlitz-Reproduktion und untersuche die Behandlung von value/checked in MatRadioGroup und MatRadioButton. Führe wiederholte Aufrufe von reset, setValue und patchValue mit Objektwerten durch und verfolge dann, wie das zweite Update verglichen wird. Erledigt ist es, wenn das ausgewählte Radio nach jeder wiederholten Aktualisierung und nach dem Ändern der Optionen weiterhin aktiviert bleibt.

Vom Indexierungsmodell aus dem Issue-Text verfasst.

Bewertung

Tech-Stack
angular, typescript
Bereich
frontend
Issue-Typ
Bug
Schwierigkeit
4/5
Geschätzter Aufwand
3-5 Tage
Aktivitätsstatus
Veraltet
Klarheit
Größtenteils klar
Anfängerfreundlichkeit
35/100

Neue Issues direkt in Ihr Postfach

Eine kurze Übersicht über anfängerfreundliche GitHub-Issues.