角度4/5绑定输入字段

Question

我在表单上有一个输入字段，如下所示：

<mat-form-field>
                                    <input formControlName="dateFormCtrl" matInput [matDatepicker]="picker" [max]="maxDate" [min]="minDate" placeholder="When is your event?"
                                        (click)="picker.open()" readonly>
                                    <mat-datepicker-toggle matSuffix [for]="picker"></mat-datepicker-toggle>
                                    <mat-datepicker touchUi="false" #picker></mat-datepicker>
                                    <mat-error>The input is required.</mat-error>
</mat-form-field>

我正在使用步进过程来完成表单，我想知道如何将此输入绑定到第二步，这样他们仍然可以看到他们选择的内容并在稍后阶段进行更改。这样的旅程就是这样的：

第1步：用户从日期选择器中选择日期

用户按下“下一步”

第二步：用户在输入框中看到他们选择的日期（它应该仍然可以编辑）

Answer 1

您可以尝试绑定到(input)事件，并使用所选日期执行您想要的操作：

示例：

<input (input)="onDateSelect($event.target.value)"
    formControlName="dateFormCtrl" matInput [matDatepicker]="picker"   
    [max]="maxDate" [min]="minDate" placeholder="When is your event?"
    (click)="picker.open()" readonly
>

所选日期将显示在$event.target.value中，您可以在onDateSelect功能中执行所需操作，以便在后续步骤中使用它。