Question

在键入文本时，它将小写，但是当鼠标移开时，第一个字母必须变为大写。

Answer 1

我假设您不使用反应形式。不需要单独的指令，因为您所需要做的就是处理焦点移出事件。基本上，您可以将focusout事件绑定到您的输入。聚焦之后，将触发trigger()方法。

在您的component.html上，

<input class="form-control" (focusout)="trigger($event)" [(ngModel)]="sampleInput" type="text">

在您的component.ts上，trigger()方法将首字母转换为大写。然后，我们将转换后的字符串分配给您的模型（sampleInput）

sampleInput: string = undefined;
.
.
trigger(event) {
  const inputValue = event.target.value;
  const result = inputValue.charAt(0).toUpperCase() + inputValue.slice(1);
  this.sampleInput = result;
}

但是，在一个不太相关的注释上，我个人最喜欢的是通过纯CSS处理它。但是，当然，此解决方案有局限性，因为它会大写字符串中每个单词的首字母（例如，“ hi john”->“ Hi John”），而不是整个字符串的首字母。此方法的一个明显优点是不会更改该字符串的基础值，因为仅会影响“显示”。

input {
  text-transform: capitalize;
}

仅当使用AngularJS中的指令将鼠标点击到另一侧时，如何自动将输入字段中的第一个字符大写？

1 个答案: