使用装饰器在Angular 2中使用TypeScript进行验证

前端之家收集整理的这篇文章主要介绍了使用装饰器在Angular 2中使用TypeScript进行验证前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我正在开发一个项目,我使用Angular 2和NodeJS与TypeScript.

Angular2使用装饰器来定义组件.我希望能够以相同的方式在域对象上表达验证逻辑.这将是有用的,因为我可以表达一次验证规则并在服务器端和客户端使用它.

而不是像这样在标记中表达必填字段:

<input required [(ng-model)]="selectedHero.name"></input>

我想这样做:

class Hero {
    id: number;

    @required
    name: string;
}

我正在试图弄清楚如何编写指令来读取元数据以将所需属性应用于输入元素以及NodeJS中以创建验证错误.任何指导表示赞赏.谢谢您的帮助.

解决方法

问题包括两件事:
– 基于装饰器验证模型
– 在UI中显示结果

首先,您可以使用任何打字稿验证器.例如.类验证器.第二部分我还在试图弄明白.

编辑:在调查之后,我会这样做:
使用Class Validator作为装饰器,使用angular 2表单构建器创建表单,附加到表单的valueChanged事件,在事件执行验证器并为您收到的每个验证错误设置相应的formcontrol错误. (查找setErrors方法.)

请记住,表单中的任何更改现在都会重新评估所有输入.这可能需要改进.此外,我将所有逻辑抽象为一个服务,它将提供一个基于typescript类的表单,并连接所需的所有东西.

猜你在找的Angularjs相关文章