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

伦斯萨克拉门托

我有一个 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>

在此处输入图片说明

穆罕默德·卡尔科特利

你实际上并没有在你的输入中添加那个“内部”,它实际上是 oustide,如果你想要实现的是自动填充输入,那么你需要使用value属性 on<input/>但这当然会导致问题,因为你不能使用该date pipe内部value属性,因此,你将不得不使用ngModel它,因为将你正在使用的改变你的方法Reactive Forms的方法,但你会想出解决办法既容易使用standalone = truengModel如果你不希望此字段是的出现在您的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.

希望这有帮助。

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章

mat-form-field必须包含MatFormFieldControl

“ mat-form-field”和“ mat-input-container”有什么区别

“ mat-form-field”不是一个已知元素-Angular 4和Angular Material 2

Angular / Material mat-form-field自定义组件-ng-content中的matSuffix

在mat-form-field中更改边框颜色

用于mat-input和mat-form-field的CSS问题

如何在mat-form-field元素中的下划线类之间添加空间?

为什么在此FormArray中无法编辑mat-form-field?

无法从mat-form-field获取选定的选项以在angular2中动态生成url

如果mat-form-field在组件中,则表单布局会中断

mat-form-field始终显示所需的红色?

如何在Angular Material的mat-form-field中添加文本修饰?

如何在mat-form-field的输入中获取点击事件?

解决错误后,mat-form-field不会删除mat-form-field-invalid类

我可以将mat-form-field外包为自定义组件或指令吗?

提交后未在表单中捕获mat-form-field中的值

动态创建一个<mat-error>组件,并将其正确投影到父<mat-form-field>组件中

“ mat-form-field”不是已知元素:1.如果“ mat-form-field”是Angular组件,则请验证它是否属于此模块

与mat-form-field中的matSuffix mat-checkbox交互

如何基于值禁用角度的mat-form-field?

如何从Mat-form-field中删除Mat-form-field-wrapper?

在触摸控件之前显示mat-form-field错误消息

正确的方法来填充和删除mat-form-field的边距

mat-list-item 重叠中的 mat-form-field

Mat-form-field 在不同的浏览器中具有不同的高度

如何删除mat-form-field Angular Material中的[object Object]

是否可以调整 mat-form-field-outline 的厚度?

如何调整mat-form-field mat-chip的大小?

将拖放添加到 mat-form-field 中的 mat-chip 列表