问题标签 [mat-input]

组件代码-

html代码-

匹配当前密码的验证工作完美，并根据条件显示错误消息。但此后其输入字段仍然无效。

我也尝试过验证其余的输入字段。但是currentPassword仍然无效，这会导致整个表单仍然无效。

为什么会发生这种情况以及如何解决？有谁有想法吗？

我有一个简单的 mat-input 组件，每当我删除它的内容时，它都会显示 [object HTMLInputElement] 而不是空字段。
这是该问题的有效堆栈闪电战。
出于项目目的，我需要听取输入的每一次变化（不仅仅是在失焦时，而是每一个输入字符）。

如何重现错误？
只需在文本字段中输入一些输入，然后将其删除，它将显示 [object HTMLInputElement] 而不是空字符串。

我在handleInputChange处理输入字段中文本的每次更改的方法中添加了一个 console.log。通过查看日志，我看到了event.target.value（正确地）插入输入的值，但是当删除输入时，它具有 [object HTMLInputElement] 而不是我期望的空字符串。为什么会这样？

我Validators.pattern(/^[1-9][0-9]{0,2}$/)习惯在数字输入字段中只允许 1 到 999 之间的数字。

如果从输入范围箭头（已设置 min=1, max=999 on <input>）中选择 -ve 值，此正则表达式也会正确验证。但是当我明确输入数字时，它也接受 099、0999、0990 并且不显示错误。在 regex101.com 中检查时，相同的模式对以 0 开头的输入表示“不匹配”。为什么相同的正则表达式模式在实际代码（匹配）和 regex101.com（不匹配）中工作异常？

mat 输入掩码不允许输入字段使用字母数字。下面是我的代码。我错过了什么吗？我试图有按键事件，但它仍然不允许字母数字。任何建议请更改以下代码以允许以下格式的字母数字。

我必须将其屏蔽为这种格式（###-##-##），例如：DS9-1-B-1

下面是我尝试在 matInput 中突出显示关键字的指令。

在我的输入框中，这是我得到的：

如果不可能，那么好的，但如果可能的话，我如何突出显示关键字？我将为跨度分配一个类来着色。

在表单中使用角度材质 matInput ，当字段具有焦点时看起来相当不错：

但是当焦点不在字段上时，单元格轮廓会变得非常模糊，除非您仔细观察，否则您无法看到它，而当您看不到边框时，字段名称似乎太远了。设置css边框颜色不会改变任何东西，它标记哪个字段有焦点也很有用，但是有什么方法可以使未选择的边框更明显？

我有一个自定义 Angular 组件（Angular 12+），我对其进行了修改以使用表单重置方法。以前，组件在运行重置时仍然显示错误，但我已修复此问题，以便在重置时清除错误。但是，自定义组件上的现有测试在错误消息周围失败，我无法对测试进行正面或反面来理解原因。任何帮助深表感谢。

失败的测试 #1：“当用户输入无效输入时，AtlasInput Native 应更新无效输入失败的错误消息”错误：预期 0 大于 0。

失败的测试#2：“当用户输入无效输入时，AtlasInput Native 应在无效输入上设置错误失败”错误：预期“有效”与“无效”匹配。

input.component.spec.ts：

input.component.ts：

input.component.html：

在我不得不使用 mat-form-field 和 mat-input 的应用程序中，它在轮廓外观上工作得非常好。标准外观有一点失真，因为应该在跨度底部的线正在中间，如下图所示：

但是一旦刷新/重新加载它就会回到它应该看起来的样子。

我需要这些字段总是看起来像第二张图片，而不必每次都重新加载。如果有人知道如何解决这个问题，请告诉我。

HTML：

我有一个角度和角度材料项目，我试图从数据库中获取员工列表并以表格形式显示它们，该表格正在正确创建空间但输入未填充正确的信息，因为我没有不知道如何将元素链接到 matInput。

我知道信息确实到达了，因为正如我提到的，创建了与员工人数相对应的空间，我可以使用下面代码中看到的属性。

有谁知道我如何将 matinput 与到达的信息联系起来？

ts文件和html文件：

我想在mat-form-field的matPrefix和matInput之间以角度添加一些间距。如何在 css 中定位它们？

这是我的代码：

.html：

CSS：

如您所见，我尝试添加类，然后选择带有类的 matPrefix，它可以很好地使用左边距，但现在可以使用右边距。