获取angular4 model属性ng-reflect-model的值

来源：蜘蛛抓取(WebSpider) 时间：2018-07-02 08:10 标签： angular4 model

  • 第一节 - 创建最简单的输入框

  • 第二节 - 添加简单的验证功能

  • 第三节 - 显示验证失败的错误信息

  • 第六节 - 表单添加验证状态样式

  • 第七节 - 表单控件的状态

  • 第八节 - 使用单选控件

  • 第九节 - 使用多选控件

本教程的开发环境及开发语言：

本文主要介绍 Template Driven Forms (模板驱动式表单) 的基础知识，相关的知识点会以问答的形式进行介绍。

第一节 - 创建最简单的输入框

在 Angular 表单中，我们通过 ngModel 指令来实现双向绑定。

第二节 - 添加简单的验证功能

如何为表单控件添加验证功能？

接下来我们来添加最简单的 必填 校验。

如何判断表单控件是否通过验证？

第三节 - 显示验证失败的错误信息

如何显示验证失败的错误信息？

如何获取表单提交的值？

表单中提供的另一特殊指令，可以对表单输入内容进行分组，方便我们在语义上区分不同性质的输入。例如联系人的信息包括姓名及住址，现在需对姓名和住址进行精细化信息收集，姓名可精细化成姓和名字，地址可精细化成城市、区、街等。

第六节 - 表单添加验证状态样式

如何为表单添加验证状态样式信息？

在 Angular 表单中，若验证通过则会在表单控件上添加 ng-valid 类，若验证失败则会在表单控件上添加 ng-invalid 类。

第七节 - 表单控件的状态

表单控件除了 valid 状态外，还包含哪些状态？

在 Angular 中表单控件有以下 6 种状态，我们可以通过 #userName="ngModel" 方式获取 ngModel 对象，进而获取控件的状态信息。具体状态如下：

第八节 - 使用单选控件

第九节 - 使用多选控件

以上就是本文的全部内容，希望本文的内容对大家的学习或者工作能带来一定的帮助，也希望大家多多支持

我要回帖

更多关于 angular4 model 的文章

 

随机推荐