带货币的 PrimeNG p-inputNumber 不会强制使用移动设备仅输入数字

Question

我使用的是<p-inputNumber>PrimeNG 的标签。

\n

在计算机视图中，输入法仅允许输入数字。如果我用键盘按任何字母，该字母将不会写在输入上。一切都好。

\n

但是，当我使用移动设备（带有 Chrome 的 Android）时，网络浏览器允许我编写其他任何内容。

\n

我一直在阅读一些关于使用基本 html<input>标签强制输入数字的帖子。但是，正如我所说，我使用<p-inputNumber>带有货币选项的 primeng 标签：

\n

<p-inputNumber [(ngModel)]="newExpenseAmount" [style]="{width: '100%'}" mode="currency" currency="EUR" locale="es-ES"></p-inputNumber>\n

\n

\xc2\xbf有什么办法让它在移动设备上正常工作吗？\xc2\xbf有什么方法可以强制与此 primeng 组件兼容的移动设备上的数字键盘吗？

\n

Answer 1

您可以访问输入本身并设置类型：

HTML：

<p-inputNumber #input [(ngModel)]="newExpenseAmount" [style]="{width: '100%'}" mode="currency" currency="EUR" locale="es-ES"></p-inputNumber>

班级：

@ViewChild('input') public input: InputNumber

public ngAfterViewInit(): void {
    (this.input.input.nativeElement as HTMLElement).setAttribute("type", "tel");
}