Question

我在Angular 6中使用了反应形式。对于输入类型的文本，我希望它是大写的。我尝试了解决方法

(input)="form.patchValue({name: $event.target.value.toUpperCase()})"

该解决方案效果很好，但是当我将光标移到中间并键入一个字符时，唯一的问题是光标移到末尾。

还有其他方法或更好的解决方案吗？

Answer 1

您为什么不仅仅使用CSS来完成这项工作？

.uppercase{
  text-transform: uppercase;
}

<input class="uppercase" type="text" placeholder="type here">

Answer 2

您可以尝试以下方法：

const yourControl = this.form.get('yourControlName');
yourControl.valueChanges.subscribe(() => {
  yourControl.patchValue(yourControl.value.toUpperCase(), {emitEvent: false});
});

Answer 3

我知道这已经晚了，但是...

您可以挂钩（更改）事件而不是（输入）事件。直到用户离开该字段后，您的案例更改才会执行，但这将防止光标跳动。

如果用户在字段中按Enter提交表单，则案例更改仍将执行。

Angular 6反应形式输入值到大写

3 个答案: