模板驱动表单是什么?
在原生JS中,如果要做一个表单的验证/校验,
客户端校验:
- 需要获取到这个需要验证的DOM元素,然后获取其value值,然后处理。
- 同样可以利用HTML5内置校验,这样做性能更好,但不支持自定义校验。
Angular提供的模板驱动表单,就是一种建立在HTML内置校验基础上的 简单校验方式。
为什么说是简单校验?
HTML5的内置校验,就是为了提高性能,减少不必要重复工作而来。特点就是:不写一行脚本,也能进行用户数据(的客户端)校验。Angular模板驱动表单建立在这种基础上,所以提供了极为便利的校验手段。
两者怎么结合使用?
首先考虑这个问题,要验证表单元素,
- 要验证单个输入域,就要获取表单中内置HTML5验证对象的值,这个可以通过给表单添加 ngModel 这个directive来做到
- 通过给每个表单域 添加一个ngModel,Angular后台为每个表单域创建了一个对应的控制对象,其中包含了(各类)验证信息(等。),通过这个对象,就可以进行进一步验证。
- 要整体验证表单域(包裹多个独立表单域的form元素),假设存在这样一个API,他集合了该form域内所有独立输入域的校验结果,并暴露一个反映集合内校验结果的值,当内部所有域都符合校验要求,这个值为true(表示成功),反之则为false。
- 先不考虑这个API是什么,他应该是一个控制对象。
- 这个控制对象类似独立表单域一样,需要添加directive
- 不过,Angular自动给所有form元素添加了这个directive,叫ngForm。
原文地址:https://www.cnblogs.com/nulixuexipython/p/11007498.html
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。