看看这个plunkr:https://plnkr.co/edit/xCvnJ9682lV0Z1sBcK68?p=preview(来自this question的@yurzui赞誉)
确保不允许在输入中写入除有效格式之外的任何内容。但是有一个小问题,那就是如果你快速写出不同的字母,你可以输入不允许的东西。或者,如果只是真正快速地发送同一封信。
以下是组件:
import { Component, Input, Output, EventEmitter } from '@angular/core';
@Component({
selector: 'my-input',
template: '<input [(ngModel)]="model">',
inputs: [
'model'
],
host: {
'(input)': 'isNum($event.target.value)'
}
})
export class FormNumberInputComponent {
@Input() model: string;
@Output('modelChange') onModelChange: EventEmitter<any> = new EventEmitter();
isNum(value) {
const isNumeric = n => n === '-' || !isNaN(parseFloat(n)) && isFinite(n);
this.onModelChange.emit(isNumeric(value) ? value : new String(value.slice(0, -1)));
}
}
如何确保Angular能够跟上变化并且在写得太快时不允许这样做?