时间戳

首页 > 解决方案 > 如何编写一个应该接受 0 到 30 之间的值但不接受十进制值的验证器函数？在角

javascript - 如何编写一个应该接受 0 到 30 之间的值但不接受十进制值的验证器函数？在角

问题描述

如果用户输入 0 到 30 之间的值，它应该接受 0 ,2, 20 并且不应该接受像 20.1 , 0.1 这样的十进制值

我使用了验证器 min(0) 和验证器 max(30) 但它接受十进制值需要一个不应该接受十进制值的验证器

如果必须使用正则表达式模式，你可以给正则表达式模式代码吗？

标签： javascriptangular

解决方案

创建自定义验证器

通过实现ValidatorFn 接口在 Angular 中创建自定义验证器

创建一个只接受整数 0 到 30 的验证器

因此，为了实现我们看到的接口，我们需要一个函数，它接受一个抽象控制，并在没有错误时返回 null，或者如果有错误，则返回一个键值字典，这给了我们以下内容：

export const myNumberValidator: ValidatorFn = (control: AbstractControl) => {
  if (Math.floor(control?.value) != control?.value || control?.value < 0 || control?.value > 30)
    return {"INVALID_NUMBER": "Number must be a whole number between 0 and 30"}
  return null
}

参见 Stackblitz

推荐阅读