表单:Form

0
视频
0
完成
0%
进度
0
分钟
0
完成
0%
进度

一个表单就是使用了一个 form 标签,它的里面可以有各种各样的表单元素,比如文本字段,E-mail 字段,文本区域等等。在 angular 的应用里面,创建一个表单,可以先用一个 form 标签 ... 这个标签在 angular 里面同样是一个指令 ...

这个指令会去创建一个 ngModelController 的实例,这个实例可以解析,格式化,还有验证表单,它会去跟踪属于它的所有的表单元素,还有这些元素的状态,比如是否有效,有没有被碰过等等。

下面我们先试一下 ... 打开 index.html ,在这里输入一组 form 标签 ... 然后再给这个表单添加一个 name 属性,去指定一下它的名字,这个名字就是实例化之后的 ngModelController 的实例的名字。这里我们叫它 userForm ..

<form name="userForm"></form>

这里我们可以把它绑定在视图上,输出来看一下 ... {{ userForm }} .. 保存 ... 会输出一个 json 格式的数据 .. 为了让它显示的更清楚一些,我们用一组 pre 标签包装一下输出的内容 ... 然后在这里再应用一个 json 过滤器 ...

<pre>{{ userForm | json}}</pre>

上面有一些属性 ... $error 这里会包含表单的错误信息 ... $name 是表单的名字 ... 这里就是 userForm ... $dirty ,这个属性可以表示这个表单有没有被碰过,如果被碰过,比如用户在这个表单里面的元素上输入了内容 .. 这个属性的值就会是 true ... 现在它的值是 false ... 如果表单没有被碰过的话,$pristine 这个属性的值会是 true ...

$valid 表示表单是否有效 .. 比如在验证表单遇到错误,它的值就会是 false ,$invalid 这个属性的值就会是 true ... 如果提交了表单,这里的 $submitted 属性的值,就会变成 true ...

https://docs.angularjs.org/api/ng/directive/form

https://docs.angularjs.org/api/ng/type/form.FormController

表单:Form《 AngularJS 基础 》

统计

14696
分钟
0
你学会了
0%
完成

社会化网络

关于

微信订阅号

扫描微信二维码关注宁皓网,每天进步一点