I have running Angular 11 application. In the page I have 2 radio buttons and one dropdown. The behavior is that whenever I change the radio button selection, I want to reset dropdown value and show empty value in the dropdown.
Below code is working fine in Chrome. But in IE I can still see empty option in the dropdown. I don’t want to show empty option in the dropdown list.
test.component.html
<form [formGroup]="myForm">
<select [id]="control.Id" [formControlName]="control.Id" [value]="control.Value">
<ng-container *ngFor="let item of control.Items">
<option [value]="item.Value">{{item.Key}}</option>
</ng-container>
<option hidden disabled value="" style="display:none;"></option>
</select>
</form>
test.component.ts
this.myForm.controls['City'].valueChanges.subscribe(this.onCityChange.bind(this));
onCityChange()
{
this.myForm.get['City'].patchValue('');
}