我的要求是在一个Angular 项目中,我以这样的形式输入数字,第一个月我不应该允许用户输入负值,即使从复制粘贴或通过增加/减少按钮的输入类型数字或思想键盘。我们如何才能实现这一点,我见过一些指令,他们把输入作为'文本',我的情况是它应该是“输入类型编号”只。它也应该允许小数。请帮帮我
ddhy6vgd1#
你可以像下面这样做超文本标记语言:
<input type="number" min="0" (input)="checkValue($event)">
字符串TS:
checkValue(event) { if (event.target.value < 0) { event.target.value = 0; } }
型也可以使用(keyup)
(keyup)
更新:
在Angular中,你可以创建一个管道。工作stackblitz在HTML中:
<input type="number" min="0" [ngModel]="testValue | nonegativevalue" (ngModelChange)="testValue=$event">
型
非负性评估管道
import { Pipe, PipeTransform } from '@angular/core'; @Pipe({name: 'nonegativevalue'}) export class NoNegativeValue implements PipeTransform { transform(value: number): number { if(value < 0) { value = 0; return value; } return value; } }
型如果你使用的是React形式,那么检查这个stackblitz
d6kp6zgx2#
试试这个
<input type="number" min="0" #input class="form-control" [(ngModel)]="dataItem.quantity" oninput="this.value = this.value.replace(/[^0-9.]/g, '').replace(/(\..*)\./g, '$1');">
字符串
nue99wik3#
如果你使用模板驱动方法,你可以在你定义了你的字段的模板(html文件)上使用这个模式:pattern="^[1-9]+[0-9]*$”。这是快速和容易的
3条答案
按热度按时间ddhy6vgd1#
你可以像下面这样做
超文本标记语言:
字符串
TS:
型
也可以使用
(keyup)
更新:
在Angular中,你可以创建一个管道。工作stackblitz
在HTML中:
型
非负性评估管道
型
如果你使用的是React形式,那么检查这个stackblitz
d6kp6zgx2#
试试这个
字符串
nue99wik3#
如果你使用模板驱动方法,你可以在你定义了你的字段的模板(html文件)上使用这个模式:pattern="^[1-9]+[0-9]*$”。这是快速和容易的