formcontrol in a ngIf or setting min date for datepicker-CodePudding

I am not sure how to use the formcontrol value to control the display of another element. I would know using ngModel, but that is not an option. Basically I have to different elements that I need to use the value of another form item to control things in those elements. Here's an example:

<mat-form-field  appearance="fill">
  <mat-label>Choose a date</mat-label>
  <input matInput [min]="minDate" [matDatepicker]="picker">
  <mat-datepicker-toggle matSuffix [for]="picker"></mat-datepicker-toggle>
  <mat-datepicker #picker></mat-datepicker>
</mat-form-field>

<div *ngIf="isShow" id="hello">hello</div>

...

<mat-checkbox formControlName="name">name</mat-checkbox>

  <mat-form-field appearance="outline">
        <mat-label>Start date:</mat-label>
        <!-- #docregion toggle -->
        <input matInput [matDatepicker]="startpicker" formControlName="startDate">
        <mat-datepicker-toggle matSuffix [for]="startpicker"></mat-datepicker-toggle>
        <mat-datepicker #startpicker></mat-datepicker>
        <!-- #enddocregion toggle -->
      </mat-form-field>

so in this example, I wanted the checkbox name being selected controlling the div hello being displayed or not. And I would like the start date value in my date picker to control the minDate in the datepicker above. But since formcontrols are async, I am not sure how to do this and I could not find examples.

Thanks for the help!

CodePudding user response：

You can use formcontrol value

<div *ngIf="someForm.controls.name.value" id="hello">hello</div>

<input matInput [min]="someForm.controls.startDate.value" [matDatepicker]="picker">