In my application, I need to reset input type radio button on cancel button click in reactive forms.
<form [formGroup]="form1">
<button click="save()">save</button>
<button click="Cancel()">Cancel</button>
<div *ngFor*="let items of itemarray">
<input type = "radio" (change)="onChange()" name="test_{{id}}" id="test_{{id}}">None</input>
<input type = "radio" name="test_{{id}}" id="test_{{id}}">Full</input>
</div>
</form>
in TS file
onChange()
{
this.form1.markasdirty();
}
cancel()
{
this.form1.reset()
this.itemarray = this.originalArry();
}
reset option is not resetting radio button existing value on cancel button. Also assigning fresh data to itemarray but its not reflecting on UI.
I tried below code on cancel button -
this.form1.get(this.form1.value).reset();
here I'm getting this.form1.value as undefine
originalArrybe carefully to use a "copy" of the array. If you use, e.g. this.copyArray=this.originalArray you have an unique array, you need make a deep copy:this.copyArray=JSON.parse(JSON.stringify(this.originalArray));if is an array of objects or simplythis.copyArray=[...this.originalArray]if is an array of string/numbers or boolean.