angular - 如何将设备的键盘更改为大写？

Question

这是我的输入:

<ion-item>
      <ion-label color="primary">Nickname</ion-label>
      <ion-input formControlName="nickname" [(ngModel)]="nickname"></ion-input>
</ion-item>

如何使用 Ionic 2 将设备的键盘更改为大写？

Answer 1

如果您只是想让插入该字段的所有文本都变成大写，您只需将 text-transform: uppercase; 添加到该字段的 CSS 即可。

如果您确实需要将用户的键盘更改为“大写模式”，这在不久之前是不可能的，但是最近的浏览器(和 Ionic)支持一个名为 autocapitalize 的新属性，它可以正是您想要的:将 autocapitalize 属性设置为 true 的输入元素将使移动设备上的虚拟键盘大写。

您可以在此处查看有关 autocapitalize 的更多信息:https://developers.google.com/web/updates/2015/04/autocapitalize

所以你应该把你的ion-input改成:

<ion-input formControlName="nickname" 
           [(ngModel)]="nickname" 
           autocapitalize="characters">
</ion-input>

(其他autocapitalize选项是“words”和“sentences”，我相信这应该是不言自明的)

请记住，用户仍然可以手动将键盘恢复为小写，因此如果您确实需要输入文本为大写，则需要将其与 text-transform: uppercase; 在 CSS 中。