Mat select drop down validation not working for the selected field Angular & Material

Question

I am working on Angular Material validation for the mat drop down. I have a drop down where if select the drop down value as Text will get text box (type = Text), the same if I select Number text box with (type = Number) will display, the same if I select date mat date field will display.

Here I want to have validation. if the field is empty I need to display error message but it is not working.

Here is my sample code:

 <div class="form-group">
      <label for="Name">Name of Assumption</label>
        <input type="text" class="form-control" placeholder="Enter Assumption Name"
                    formControlName="assumptionName"
                    [ngClass]="{ 'is-invalid': submitted && f.assumptionName.errors }" minlength="1" maxlength="50">
                <div *ngIf="submitted && f.assumptionName.errors" class="invalid-feedback">
                    <div *ngIf="f.assumptionName.errors.required">Name of Assumption is required</div>
                </div>
            </div>

Here is the Stackblitz code for the reference.

Answer 1

As per your Stackblitz example, you haven't call the function initassumpationForm(), which will create form controls for your form.

When I call that function from contructor or ngOnInit, it worked.