是否可以将当前日期和时间放在 mat-form-field 中？答案

【问题标题】：Is it possible to put the current date and time inside a mat-form-field?是否可以将当前日期和时间放在 mat-form-field 中？
【发布时间】：2021-10-20 18:30:55
【问题描述】：

我有一个 mat-form-field，我希望当前时间显示在输入字段中。我可以在里面添加它，但我的样式有问题。这是代码行：

<mat-label>Filing Time:</mat-label><br>
              <mat-form-field appearance="outline" class="width-1">
                <input
                  matInput
                  formControlName="filingTime"
                  readonly
                  required
                />
                {{ filingDate | date: 'HH:mm:ss' }}
              </mat-form-field>

【问题讨论】：

标签： angular typescript input time mat-form-field

【解决方案1】：

你实际上并没有在你的输入“内部”添加它，它实际上是 oustide，如果你想要实现的是自动填充输入，那么你需要在 <input/> 上使用 value 属性，但这当然会导致问题，因为您不能在 value 属性内使用 date pipe，因此，您将不得不使用 ngModel 这将改变您的方法，因为您使用的是 Reactive Forms 方法，但您会通过使用 standalone = true 用于您的 ngModel（如果您不希望此字段出现在您的 form 中），或者您可以保留 name 属性而不是 formControlName 并且也可以（如果您希望该字段出现在您的 form 中），基本实现将如下所示：

<mat-label>Filing Time:</mat-label><br>
<mat-form-field appearance="outline" class="width-1">
  <input matInput [ngModel]="filingDate | date: 'HH:MM:SS'" />
</mat-form-field>

在查看模板其余部分中的更多代码以及您的component class 后，我可以更新此答案以适合您的情况。

希望这会有所帮助。

【讨论】：