基本上,我是一个角以及java脚本的初学者。这里试图用一些条件验证一个反应性表单文本字段。
条件如下:
发布于 2018-07-28 12:21:57
如果您知道regex模式可以使用Validators.pattern
--我建议编写一个自定义验证器--将比复杂regex模式更易于维护和读取,并且您可以提供有关值验证的自定义错误消息,另一件事是,自定义验证器只是一个函数,如果验证失败或验证成功,则返回一个对象。
自定义反应性表单验证器
import { AbstractControl, ValidationErrors } from "@angular/forms"
export const inputTextValidator = function inputTextValidator(control: AbstractControl): ValidationErrors | null {
let getErrorObject = function (message): ValidationErrors {
return {
inputText: true,
message // provide custom error message related to the validation role
}
}
let value: string = control.value || '';
// check if value length between specific range like 7-25
if (value.length < 7 && value.length < 25) {
return getErrorObject(`text length must be between 7-25 ,current length ${value.length}`);
}
// check if value invalid characters like #$%^%$^/-+
let validCharacters = /^[a-zA-Z0-9\*]+$/g
if (validCharacters.test(value) === false) {
return getErrorObject(`text has invalid characters,current value ${value.length}`);
}
let asterisk = /^\w+\*?$/g
if (asterisk.test(value) === false) {
return getErrorObject(`only one asterisk at the end of the string is valid,current value ${value.length}`);
}
// check the asterisk postion at 8th-13th
let indexOfAsterisk: number = value.indexOf('*'); // index base on 0
if (indexOfAsterisk >= 0 && (indexOfAsterisk < 8 || indexOfAsterisk > 12)) {
return getErrorObject(`asterisk must bee in postion at 8 -13 th,current * postion ${indexOfAsterisk}`);
}
return null;
}
在您的示例中,您不会显示从第5开始星号的有效位置,这将破坏关于值min长度的第一个角色,这就是我最迟确保min为8的原因。
https://stackoverflow.com/questions/51551831
复制相似问题