igx-radio and igx-radio-group don't work with dynamic content

[yl-endress]

Dear igx-team,

Description

There is some weird behavior with the igx-radio and igx-radio-group with formControls and dynamic content

• igniteui-angular version: "12.3.9", "12.3.33" and also "14.0.11"
• browser: Chrome Version 103.0.5060.134 x64

Steps to reproduce

Simple have a look here https://stackblitz.com/edit/angular-mgp2nr-9ka7qq

a) the ideal solution is not working at all

1. press the button below
2. click on all radios
3. all options are selected -> scope is lost

b) workaround is having issues with the reset

1. click Banana
2. click on reset
3. mango is selected, but the form-control is still dirty
4. click reset again: now it works as expected

Result

a) the scope of the radios get lost -> multi selection b) formControl+formGroup stays dirty

Expected result

a) no multi select, single select as radios normally do b) formControl+formGroup are reset properly (pristine and not dirty) -> reset works with the first click

Attachments

Here a screenshot containing both errors

[ChronosSF]

Likely related to #11849