问题标签 [mat-input]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
1 回答
2277 浏览

angular - mat-input 中的占位符位置

我正在使用 angular6 和 angular 材料来创建这个整洁的网站。

我正在使用一个mat-form-field带有mat-input文本的文本输入元素placeholder

占位符文本位置有两种状态。

一!当文本输入为空并且您没有专注于该元素时:

空垫输入

另一个当您专注于输入文本和/或您输入文本不为空时

带文本的垫输入

我希望 mat-input 元素处于第二状态。即使其中没​​有文本并且我没有专注于该元素,也要在文本输入元素上方显示占位符。

我知道我可以解决问题并为元素的值添加某种空白空间..但是有没有更优雅的方式来实现我需要的东西?

谢谢!!!

0 投票
1 回答
293 浏览

angular-material - 如何在焦点上更新 Mat-Input 占位符

我有这个材料输入字段,当用户关注输入时,我希望有一个不同的占位符。

当没有重点和没有价值

在此处输入图像描述

当用户关注它时

在此处输入图像描述

当用户有一些价值并关注它时

在此处输入图像描述

Material 中是否有事件或解决方法来实现相同的目标。

0 投票
1 回答
2244 浏览

datepicker - Angular Material DatePicker 的输入在键入后的月份和日期会发生变化

我正在使用 Ionic 4/Angular 7 和 Angular Material 7.2.1 开发应用程序。

该应用程序使用巴西日期格式 DD/MM/YYYY。

当我使用日期选择器本身选择日期时,输入中的文本很好。

但是,在日期选择器的(模糊)输入中键入日期后,月份和日期会被切换。例如,如果我输入 03/02/2015,在模糊事件之后,输入将显示 02/03/2015。

app.module.ts:

在 app.component 我做:

如何设置 mat-datepicker 以便它识别输入中键入的日期格式?

0 投票
1 回答
1872 浏览

angular - 为应用程序中的所有输入设置默认指令

我使用mat-form-field自定义 css 来更改 be look likeappearance="outline"指令。

InAngular Material v 7.2.1 appearance="outline"已添加到mat-form-field选项中。

如何appearance="outline"为我的应用程序中的每个输入字段声明为默认值?

0 投票
2 回答
14063 浏览

angular - 在 mat-form-field 控件之前设置图像图标

我是角度和构建示例应用程序的新手。

我有一种情况,我从角度数据表中加载表单。加载时的表单具有基于数据库数据填充的属性。

对于表单中的一个字段,除了显示文本之外,我还想在控件之前放置一个图标,以在文本值之外添加一个视觉指示器。这不是角度材料图标中的图标,而是自定义图像。

我目前面临将自定义图标内联设置到 mat-form-field 的问题。

当我在 mat-form-field 控件中包含图像时,我看到该图标在一行中,而文本字段值在另一行中。

当我在 mat-form-field 控件之外设置图像图标时,字段的标签仅在字段值上方,图像图标显示在外面,看起来很尴尬。

请找到指示问题的图像。

下图表示当我在 mat-form-field 之外有图像控件时出现的问题。

在此处输入图像描述

当我将图像控件带入 mat-form-field 时,图像和字段值位于不同的行上。

在此处输入图像描述

此外,有没有办法以左右方式而不是上下方式设置角度材料的表单字段控件的标签字段,并且还增加标签控件的大小。目前,标签字段在我看来已经褪色。

此控件上设置的 CSS 类具有以下代码

来自 JIRA 的示例图片

在此处输入图像描述

0 投票
14 回答
98477 浏览

css - 如何更改 mat-form-field 中的高度

我怎样才能改变mat-form-field高度appearance="outline"

我需要减少 mat-form-field。

我的输入示例

在此处输入图像描述

0 投票
1 回答
468 浏览

angular - 从默认主题更改为自定义主题会从 MatInput、Angular 6 中删除光标

我想从默认的角度材质配色方案更改为自定义配色方案。我的问题是,当我这样做时,MatInput 字段在聚焦时停止显示闪烁的光标。我想知道如何使它在单击时恢复为闪烁状态。

主题.scss

监管.component.html

0 投票
1 回答
3689 浏览

angular - Angular mat-input 将 [value] 绑定到 [(ngModel)]

我有这张桌子:

我的数组处方具有以下结构:

表格的每一行代表这个数组的一个对象。在每一行中都有一个mat-select元素从这个selectedObjects数组中获取它的选项:

我要实现的是将所选选项的值绑定到行元素object.id的属性idObject。所以我所做的是使用[value]="object.id" [(ngModel)]="prescription.idObject"但它不起作用,因为所有行的属性都保持为 0。我已经通过在方法中打印属性check(即每一行)来检查这一点。
有没有办法实现这种绑定?

0 投票
1 回答
267 浏览

angular - 通过将表单控件输入用作变量来检查表单控件输入是否存在错误

我正在使用 angular 8 和 angular 材料来编写我的网站。

我有一个formGroup创建的表单,我希望能够*ngIf通过使用实际输入元素作为参数来检查验证错误。

目前这是我的工作代码:

我有以下表格:

在组件的类中,我实现了hasError()这样的功能:

当然,我将queryForm变量配置为由表单生成器创建的组。

有没有办法在不从类本身调用函数的情况下检查错误?

因为我添加#timezone到输入字段中,所以我认为我将能够执行以下操作:

但我不能!:)

我更喜欢使用类似的东西,因为我想创建一个带有一些 mat-errors 的错误处理组件,因此我将能够在每个输入字段中重用它,并且我想将输入控件而不是整个表单粘贴到它团体。

任何有关此问题的信息将不胜感激。

谢谢!

0 投票
1 回答
813 浏览

javascript - How can I set focus for mat-input inside the mat-radio

I am trying to set the focus (the cursor to blink) on the input box on the click on the custom radio button. But it is not happening.I have stackblitz demo here.

so far I have tried.

in component