I have built a form in Angular using ReactiveFormsModule
that uses primarily dropdown boxes via the <select>
element.
Each <select>
is databound to an Angular FormControl instance; upon loading the webpage the dropdown menus are automatically loaded with a value from a REST API call, but what I want is for them to display a blank entry until the user manually clicks the dropdown and selects one of the options below.
Is there a way to do using the ReactiveFormsModule
?
CodePudding user response:
You could just add an option
in the select
directly in the template. If you want, you could also use *ngIf
on that option to remove it once you receive your data. Something like this maybe:
<mat-select>
<mat-option *ngIf="!data" [value]="null">
Loading...
</mat-option>
</mat-select>