【问题标题】：How to add Validation pattern not to allow only space in input Angular2?如何添加验证模式以不允许输入 Angular2 中仅包含空格？
【发布时间】：2017-08-17 01:52:36
【问题描述】：

我在 Angular2 中使用了 formBuilder，并希望添加验证模式以不允许输入中的“仅空格”。

【问题讨论】：

伙计们，如果你想投反对票而不解释为什么要上 youtube plz
@theFreedomBanana 这不是很明显吗？在 OP：你尝试过什么？给我们看一些代码。为什么/如何失败？有错误信息吗？向我们展示整个问题的example。
@TobiMcNamodi 我真的不认为需要代码或示例，标题是不言自明的。即便如此，OP 在 S.O 上似乎是新鲜事物，可能不了解我们中的一些人需要的所有纪律，并且不加评论地投票不会启发她

标签： angular typescript

【解决方案1】：

空格不允许

let nospacePattern = [a-zA-Z0-9]

更新

根据评论部分的要求。

需要模式不能只允许空格。（允许单词之间的空格）。但是当用户在输入中输入空格并尝试保存时，它不应该允许保存

Validators.pattern(".*\\S.*[a-zA-z0-9 ]");

更新 2

使用自定义验证模式的更好和更简洁的方法，如下所示 -

controlName: ['', [Validators.required, this.noWhitespaceValidator]],

....
....
noWhitespaceValidator(control: FormControl) {
    const isWhitespace = (control && control.value && control.value.toString() || '').trim().length === 0;
    const isValid = !isWhitespace;
    return isValid ? null : { 'whitespace': true };
  }

【讨论】：

需要模式不能只允许空格。（允许单词之间的空格）。但是当用户在输入中输入空格并尝试保存时，它不应该允许保存。
@PoonamThot 请检查更新
Update 2 非常适合在验证服务中使用。谢谢

【解决方案2】：

嘿，我知道我参加聚会很晚了，但我也遇到了同样的问题，我已经厌倦了以下代码并且它有效：

根据我的要求，表单注释框中应包含至少 30 个字符，并且该字符应为非空格。所以为了添加验证，我使用了以下代码。我正在使用反应形式。在ts文件中，添加如下代码

comment:[''[Validators.required,Validators.minLength(30),Validators.pattern(/^((?!\s{2,}).)*$/)]]

Hey this sentence has one space between every word //这会起作用

Hey this sentence has more than one space between every word //这会报错

我希望这对将来的人有所帮助。

【讨论】：

【解决方案3】：

使用以下内容：

Validators.pattern(/^\S*$/)

DEMO

【讨论】：

【解决方案4】：

试试这个，它会在按下 sapce 键时返回 false ：

@Component({
  selector: 'my-app',
  template: `
    <div>
       <input class="form-control" type="number" formControlName="pinCode" placeholder="Pin Code"
             (keydown.space)="$event.preventDefault()">
    </div>
  `,
  providers: [myService]
})

【讨论】：

这仅适用于按空格键的用户，如果他们复制/粘贴两个单词之间有空格的文本，该字段将允许这样做
如果你想输入一个值，例如，这将不起作用。 John Doe。您不能在名字后添加空格。问题还说要防止添加 ONLY 空格，而不是防止在单词之间添加空格。