Question

我正在使用角度飞镖开发应用程序。我正在使用角度飞镖材料输入来获取用户输入。

我有一个多行文本输入，为此我使用了材料输入并输入了“文本”。

我已将此字段设置为“必填”，但问题是当用户输入空白或输入空格时，“必填”消失了。我需要一个可以在其中指定一个约束的属性，该约束必须至少输入一个非空白字符。

如何实现？

这是我使用材料输入的代码：

<material-input
    ngControl="textAnswer" [(ngModel)]="answer" multiline
    type="text" label="Your answer" required>
</material-input>

Answer 1

根据documentation，您可以将所有input个元素属性与其一起使用。

可以与普通<input>和<textarea>元素一起使用的所有属性也可以用于<mat-form-field>内部的元素

因此，请使用HTML5 pattern attribute来匹配自定义模式（正则表达式）。

<material-input
    ngControl="textAnswer" [(ngModel)]="answer" multiline
    pattern="[\s\S]*\S[\s\S]*"
    type="text" label="Your answer" required>
</material-input>

[\s\S]*\S[\s\S]*将有助于匹配具有至少一个非空格字符的字符串。

注意：要包含所有其他字符，请使用[\S\s]，因为.不包含换行符。

如何在材料输入中验证输入文本的长度？

1 个答案: