Angular Setting Default Value for a Combobox

Issue

In my code, I have an input field in the form of a dropdown. The dropdown has 5 options(empty, 1, 2, 3, 4). Options 1,2,3 and 4 comes from the database and in UI, I want to set the input value as 0 when I choose the empty option. Here is my code and a screenshot. What should I do to set that empty field as 0?

HTML:

 <mat-form-field appearance="outline" fxFlex="100" fxFlex.gt-xs="30" class="w-100-p">
                    <mat-label>Dönem Hafta</mat-label>
                    <mat-select formControlName="PlanWeek">
                        <mat-option *ngFor="let week of weekList" [value]="week.Id">
                            {{week.Name}}
                        </mat-option>
                    </mat-select>
                </mat-form-field>

TS:

_productionService.onWeekListChanged.subscribe(
  (response: IBasicModel[]) => {
    this.weekList = response;
  }
);

Solution

 <mat-option [value]="null">''</mat-option>

For more examples please refer to Angular Material documentation

Angular Material MatSelect

Answered By - Yuriy