angular表单&服务

最新推荐文章于 2021-09-14 17:27:41 发布

yakelande

最新推荐文章于 2021-09-14 17:27:41 发布

阅读量368

点赞数

分类专栏： Angular 文章标签：表单事件 ngModel 表单验证服务 HttpClient

本文链接：https://blog.csdn.net/yakelande/article/details/79530017

版权

表单事件
```
(keyup.enter)=""
(blur)=""
```
表单模板在模板驱动表单中，你只要导入了FormsModule就不用对<form>做任何改动来使用FormsModule。
```
<form #loginForm="ngForm">
```
loginForm变量是一个到NgForm指令的引用，它代表该表单的整体。

Angular会在<form>标签上自动创建并附加一个NgForm指令。

NgForm指令为form增补了一些额外特性。它会控制那些带有ngModel指令和name属性的元素，监听他们的属性（包括其有效性）。它还有自己的valid属性，这个属性只有在它包含的每个控件都有效时才是真。

不要忘记表单元素要有name属性哦！！

在内部，Angular 创建了一些FormControl，并把它们注册到NgForm指令，再将该指令附加到
标签。注册每个FormControl时，使用name属性值作为键值。
通过 ngModel 跟踪修改状态与有效性验证
通过ngModel可以获取表单元素的状态，但是必要条件：
- 元素要有name属性
- 通过ngModel进行双向绑定（要绑定到ts文件中的变量）

关注