I have a mat-select component in one of my components as follows
<div id="graph-textbox">
<input type="textbox" class="form-control" [(ngModel)]="graph1_query"
placeholder="Search for Entities/Relations"
(keyup)="EnterKeyupChecker('graph-search',$event)"
>
</div>
<div style="padding-right: 5px" class="graph-dropdown">
<mat-form-field appearance="fill" style="width: 100%;">
<mat-label>Select Type</mat-label>
<mat-select [(ngModel)]="graph1_type_query"
(selectionChange)="graph1_subtype_query='';InGraph1Search();"
>
<mat-option value="">None</mat-option>
<mat-option *ngFor="let type of type_dropdown" [value]="type">
{{type}}
</mat-option>
</mat-select>
</mat-form-field>
</div>
This mat-select was working perfectly till yesterday, showing the options and even performing the selection actions. When I began work on my Angular app today, it shows no options, and just highlights the mat-label when I click it. Absolutely nothing was changed in the code.
The value of graph1_type_query is '' on declaration in the .ts file and is not touched after that throughout the code. The value of graph1_query is working as intended.
What I've come across so far:
<mat-select [(ngModel)]="graph1_type_query">
<mat-option value="">None</mat-option>
<mat-option value="One">One</mat-option>
<mat-option value="Two">Two</mat-option>
<mat-option value="Three">Three</mat-option>
</mat-select>
UPDATE: It work perfectly fine with native select. What could the issues with mat-select be?