AngularJS使用angular-formly进行表单验证

前端之家收集整理的这篇文章主要介绍了AngularJS使用angular-formly进行表单验证前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

当验证表单中有很多字段时,这时候可能希望把html的生成以及验证逻辑放到controller中,在页面,也许是这样的:

然后,在controller中定义各个字段以及验证。angular-formly就是为这个需求而存在。

在controller中,把各个字段定义在数组中:

required: true } },... ]

使用hideExpression字段定义隐藏的条件:

Box',templateOptions:{ label:'是否不满18岁' },hideExpression: '!model.email' //email验证失败之前不显示 }

使用validators字段自定义验证规则:

首先安装:npm install angular-formly angular-formly-templates-bootstrap bootstrap api-check

Demo的文件结构:

css/ .....style.css node_modules/ scripts/ .....MainController.js .....provinces.js [提供select的选项,有关省]

app.js

index.html

index.html

<@R_502_338@ charset="gb2312">

猜你在找的JavaScript相关文章