使用Angular 6限制文本框中第一个位置的空间答案

【问题标题】：restrict space at first position in textbox using Angular 6使用Angular 6限制文本框中第一个位置的空间
【发布时间】：2019-09-14 11:28:51
【问题描述】：

我有一种情况，我需要限制用户在 TextBox 的开头输入空格。我能够限制文本框中的空间输入。但没有任何关于不允许在第一位置的线索。

我正在寻找使用 Angular 6 的解决方案。任何帮助将不胜感激。

【问题讨论】：

如果您正在寻找正则表达式 - ^(?!\s+)

标签： html regex angular typescript angular6

【解决方案1】：

有两种方法可以使用 Vanilla JavaScript 实现它。

1) string.replace() 与正则表达式一起使用。

解释：^ 匹配起始位置（前导），\s 匹配空白字符，+ 匹配后续元素。当您一起使用它们时，^\s+ 将匹配 1 个或多个前导空格。

const originalString = '      my Name is WenTjun';
const result = originalString.replace(/^\s+/g, '');
console.log(originalString);
console.log(result);

2) 使用String.trim()。请注意，这会修剪前导和尾随空格，因此如果您希望保留尾随空格，您可能不想使用它。

const originalString = '      my Name is WenTjun';
const result = originalString.trim();
console.log(originalString);
console.log(result);

【讨论】：

【解决方案2】：

HTML

<input type="text" (click)="handleInput($event)">

handleInput(event) {
    if (event.which === 32 && !this.value.length)
        event.preventDefault();
}

这将不允许用户仅在第一个位置添加空间

【讨论】：

var k = event ? event.which : window.event.keyCode; { if (k == 32) return false;} 它将允许用户不在任何地方添加空间。
@amrendra 这就是为什么我要检查length

【解决方案3】：

// TS文件

公共空间（事件：任何）{

if (event.target.selectionStart === 0 && event.code === 'Space'){
  event.preventDefault();
}

}

【讨论】：

正如目前所写，您的答案尚不清楚。请edit 添加其他详细信息，以帮助其他人了解这如何解决所提出的问题。你可以找到更多关于如何写好答案的信息in the help center。