ng-pattern 允许单词之间有空格答案

【问题标题】：ng-pattern to allow spaces between wordsng-pattern 允许单词之间有空格
【发布时间】：2015-11-12 08:00:58
【问题描述】：

我正在寻找一个regular expression，它可以防止特殊字符并且只允许字母、数字、破折号 (-)、下划线 (_) 和空格。

这个正则表达式效果很好，但它不允许单词之间有空格。

例如，如果输入 "123 456"，我会收到我定义的自定义错误。除了字母、数字、破折号和下划线之外，我如何调整此 reg 以允许单词之间的空格。

<input type="text" name="serialNumber" data-ng-model="SerialNumber" ng-pattern="/^[a-zA-Z0-9_-]*$/" maxlength="100"/>
<div data-ng-if="Form.serialNumber.$error.pattern" class="error">Please enter valid serial number</div>

【问题讨论】：

您想在开头还是结尾允许空格、连字符或下划线？
你想允许空值吗？
@Avinash Raj 和 @vks 是的，我希望在开头只允许使用连字符或下划线，而不是空格。
@Avinash Raj 只有字母数字、_、- 和单词之间的空格。

标签： javascript regex angularjs

【解决方案1】：

我想我找到了一个非常简单和基本的解决方案来满足我的要求i.e. to allow alphanumeric, _, - and space. Space should be allowed between word and not leading and trailing space.

ng-pattern="/^[a-zA-Z0-9\_\- ]*$/"

任何人发现它的问题，请告诉我。

【讨论】：

您的正则表达式允许前导或尾随空格。要么将其分成 3 组，中间的一组允许空格，要么完全修改你的正则表达式。见这里：regex101.com/r/sB8vL2/1
查看您的正则表达式的第 2 版分为 3 组，其中只有中间的有空格：regex101.com/r/sB8vL2/2
@ Asunez - ng-trim 默认为 true，它将删除前导或尾随空格。
我的错，没有意识到这一点。感谢您解决这个问题！

【解决方案2】：

如果要在输入中允许空格，则需要将其包含到字符类中。

根据docs：

ngTrim （可选）
如果设置为false Angular 将不会自动修剪输入。 input[type=password] 控件将忽略此参数，它永远不会修剪输入。
（默认：true）

所以，如果您的输入字段不是密码字段，我建议：

ng-pattern="/^[\w -]*$/"

\w在JS中代表[A-Za-z0-9_]，下划线不必转义，字符类末尾的连字符也不需要转义。

【讨论】：

【解决方案3】：

^[a-zA-Z0-9_-]+(?:\s+[a-zA-Z0-9_-]+)*$

以这种方式构建您的正则表达式以在开始或结束时捕获 words 而不是 spaces。

【讨论】：

不会匹配空值
@vks ng-trim 默认为 true，这样就可以满足前导/尾随空格的需要。如果我在这里错了，请纠正我。
@immirza 在这种情况下你可以简单地使用^[a-zA-Z0-9\s_-]+$
@ArunPJohny 这不是ng-required 的用途吗？
@RGraham 是的.. 所以如果我想允许空白.. 如果内容存在则验证模式

【解决方案4】：

您可以尝试以下基于环视的正则表达式。

^(?!\s)(?=$|.*[a-zA-Z0-9_-]$)[a-zA-Z0-9_\s-]*$

【讨论】：

【解决方案5】：

使用此模式解决问题

ng-pattern="/^(\D)+$/"

【讨论】：

【解决方案6】：

请 ng-pattern="/^[\w -]*$/"

【讨论】：

请在您的答案中添加一些解释，以便其他人学习