我想只得到正的值,有什么方法来防止它只使用html 请不要建议验证方法
当前回答
如果数字是负数或正使用ES6的数学。标志 Const num = -8; // Old Way Num === 0 ?Num: (Num > 0 ?1: -1);/ / 1 // ES6方式 Math.sign (num);/ / 1
其他回答
下面是一个角度上的解决方案:
创建一个类OnlyNumber
import {Directive, ElementRef, HostListener} from '@angular/core';
@Directive({
selector: '[OnlyNumber]'
})
export class OnlyNumber {
// Allow decimal numbers. The \. is only allowed once to occur
private regex: RegExp = new RegExp(/^[0-9]+(\.[0-9]*){0,1}$/g);
// Allow key codes for special events. Reflect :
// Backspace, tab, end, home
private specialKeys: Array<string> = ['Backspace', 'Tab', 'End', 'Home'];
constructor(private el: ElementRef) {
}
@HostListener('keydown', ['$event'])
onKeyDown(event: KeyboardEvent) {
// Allow Backspace, tab, end, and home keys
if (this.specialKeys.indexOf(event.key) !== -1) {
return;
}
// Do not use event.keycode this is deprecated.
// See: https://developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent/keyCode
let current: string = this.el.nativeElement.value;
// We need this because the current value on the DOM element
// is not yet updated with the value from this event
let next: string = current.concat(event.key);
if (next && !String(next).match(this.regex)) {
event.preventDefault();
}
}
}
将OnlyNumber添加到app.module.ts中的声明中,并像这样在应用程序的任何地方使用它
<input OnlyNumber="true">
如果你不想在HTML中添加更多代码,只需要添加另一种方法(使用Angular):
您只需要订阅字段valueChanges并将Value设置为绝对值(注意不要触发新事件,因为这会导致另一个valueChange,因此会触发递归调用并触发最大调用大小超出错误)
HTML代码
<form [formGroup]="myForm">
<input type="number" formControlName="myInput"/>
</form>
TypeScript代码(在组件内部)
formGroup: FormGroup;
ngOnInit() {
this.myInput.valueChanges
.subscribe(() => {
this.myInput.setValue(Math.abs(this.myInput.value), {emitEvent: false});
});
}
get myInput(): AbstractControl {
return this.myForm.controls['myInput'];
}
oninput="this.value=(this.value < Number(this.min) || this.value > Number(this.max)) ? '' : this.value;"
对我来说,解决方案是:
<input type=“number” min=“0” oninput=“this.value = Math.abs(this.value)”>
Edit
正如注释中所建议的那样,如果0是最小值,则需要进行微小的更改。
<输入类型=“数字” min=“0” oninput=“this.value= !!this.value && Math.abs(this.value) >= 0 ?Math.abs(this.value) : null“>
简单的方法:
<input min='0' type=“number” onkeypress=“return (event.charCode == 8 || event.charCode == 0) ? null : event.charCode >= 48 && event.charCode <= 57”>
推荐文章
- 给一个数字加上st, nd, rd和th(序数)后缀
- 为什么我的CSS3媒体查询不能在移动设备上工作?
- 用javascript检查输入字符串中是否包含数字
- 下一个元素的CSS选择器语法是什么?
- 我如何用CSS跨浏览器绘制垂直文本?
- 如何获得box-shadow在左侧和右侧
- 相对定位一个元素,而不占用文档流中的空间
- 从数字中移除无关紧要的尾随零?
- 如何在jQuery检索复选框值
- 禁用身体滚动
- 如何在删除前显示确认消息?
- 在一个CSS宽度的小数点后的位置是尊重?
- 检测输入是否有文本在它使用CSS -在一个页面上,我正在访问和不控制?
- 如何用jQuery清空输入字段
- 我怎么能选择一个特定的类的最后一个元素,而不是父里面的最后一个孩子?