radio-group ngModel radio element not selected after change #61
Comments
@TedSander - oops, the code used to illustrate the issue wasn't using the proper version of ng and ACX. It is now. |
@TedSander - I've added a vanilla ngDart version of the radio group to show that it works there but not in ACX. This is what the app looks like after a reset: Notice that the vanilla ngDart radio group has Mr. Nice selected, but the ACX radio group has no selection. This is the ngDart template HTML: <p>Same functionality in vanilla AngularDart:</p>
<div *ngFor="let h of heroes">
<input type="radio" name="heroes"
[value]="h" [checked]="currentHero == h"
(click)="currentHero = h">
{{h.name}}
</div> |
Do you need to recreate the list of heros every time? I tried moving that code to
|
Yes, that is part of the original demo. In fact, it is the first part of a section illustrating the use of |
I think I have a solution but I won't be able to implement it for awhile (going on vacation.)
Another option to to set the checked value on the radio itself like you did with the plain value above. Longer explanation: If there are no children previous this works as it saves the value to check on any children that may come later, but since there are already children it checks the current children for the value. In this case it actually finds the value, but it will be destroyed/re-created. Even if it doesn't find the value the value will be dropped as invalid. Separate note: one should be careful about recreating lists without using tracked by. Throwing away the views associated with those list items and recreating them is usually not what the developer wants, and it is unperformant. We've had quite a few bugs with engineers returning a different list and them expecting the view wouldn't change as much as it did. |
Thanks. Looking forward to the complete solution. FYI,
Right. This code is atypical since it is meant to illustrate why users would want to use |
The simple app from this repo runs as expected initially and displays this radio group with the
currentHero
selected:This is an excerpt from the template used to generate the view:
But if you click "Reset Heroes", the current hero is no longer selected in the radio group:
The reset action code is:
The full source for this demo (generated from a stagehand Angular web app base), is here.
This app uses
3.0.0-alpha+1
version of Angular and the latest ACX.This issue was originally discovered while working on the AngularDart 3.x sample for the Template Syntax page.
cc @kwalrath @filiph
The text was updated successfully, but these errors were encountered: