Angular Reactive Form - 填充表单模型
setValue
使用setValue,可以通过传递其属性与FormGroup后面的表单模型完全匹配的数据对象来一次分配每个表单控件值。
在分配任何表单控件值之前,setValue方法会彻底检查数据对象。
它不会接受与FormGroup结构不匹配的数据对象,或者缺少组中任何控件的值。 这样,如果您有打字错误或嵌套控件错误,它可以返回有用的错误消息。 patchValue将默认失败。
另一方面,setValue将捕获错误并清楚地报告错误。
请注意,很多数据模型(data model)可以直接作为setValue的参数,只要它们的形状类似于组件的FormGroup结构。
patchValue
使用patchValue,您可以通过提供一个键/值对的对象来为仅感兴趣的控件分配值到FormGroup中的特定控件。
使用patchValue,您可以更灵活地应对大量不同的数据和表单模型。 但是与setValue不同,patchValue无法检查缺少的控件值,并且不会引起有用的错误。
何时设置form模型的值(ngOnChanges)
//类
//@Input() connection: Connection
//implements OnChanges
ngOnChanges() {
if (this.validateForm) {
this.validateForm.patchValue({
connection: {
name: this.connection.name,
connectionType: this.connection.connectionType
},
options: this.connection.options,
description: this.connection.description,
properties: this.connection.options.properties
});
this.validateForm.valueChanges.subscribe((data) => {
console.log('Form changes', data);
});
}
}
链接:http://www.jianshu.com/p/3c97d908af47
Angular Reactive Form - 填充表单模型的更多相关文章
- Angular使用总结 --- 模型驱动表单
模型驱动表单 之前有篇博文总结了 模版驱动表单 , 以及 模版驱动表单的自定义校验 , 本篇总结下模型驱动表单. 与模版驱动表单是不同的编程思路,偏向于数据模型.先在组件中建立表单控件的对象树,再绑定 ...
- Yii表单模型使用及以数组形式提交表单数据
按Yii文档里的描述,Yii在处理表单的一般过程是: 创建表单对应的模型类,设置字段验证规则 创建表单提交对应的action,处理提交的内容 在视图中创建表单form 在刚刚的一个小项目里,想使用aj ...
- 去掉chrome记住密码后自动填充表单的黄色背景
chrome表单自动填充后,input文本框的背景会变成黄色的,通过审查元素可以看到这是由于chrome会默认给自动填充的input表单加上input:-webkit-autofill私有属性,然后对 ...
- ASP。NET Web表单模型,部分呈现和事件
下载EventExample.zip - 41.33 KB 下载EventandAjaxExample.zip - 41.94 KB 介绍 通过参考ASP获得Web应用程序环境及其约束的概述.NET ...
- 解析:使用easyui的form提交表单,在IE下出现类似附件下载时提示是否保存的现象
之前开发时遇到的一个问题,使用easyui的form提交表单,在Chrome下时没问题的,但是在IE下出现类似附件下载时提示是否保存的现象. 这里记录一下如何解决的.其实这个现象不光是easyui的f ...
- selenium如何解决IE自动填充表单问题
有时候用selenium会碰到自动填充表单的问题,如输入用户名后,密码自动填充,此时再填充密码会导致登录失败,解决办法:每个输入框都调用clear()方法
- 阻止form空表单提交----JavaScript
网上看到很不错的阻止form空表单提交 第一种方法 <div class="warp"> <h2>登录到pfan空间</h2> <p> ...
- form注册表单圆角 demo
form注册表单圆角 <BODY> <div class="form"> <ul class="list"> <li& ...
- Form提交表单页面不跳转
1.设计源码 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www. ...
随机推荐
- ++i? i++? i+=1? i=i+1? 何必纠结?
前言 今天在牛客上看面经,看到一个问题:num++; num+=1; num = num +1; 哪个效率最高? 自从学习C语言开始,我就在纠结for语言应该写i++,还是++i,其实这个问题,可以通 ...
- webstorm中sass编译时目录或内容包含中文字符报错
ruby版本:ruby 2.3.1p112 (2016-04-26 revision 54768) [x64-mingw32] sass版本:Sass 3.4.22 (Selective Steve) ...
- 跨域 cookies
script标签请求的js脚本,如果跨域了,请求会带有外域的cookies信息. XMLHttpRequest请求跨域时,需要有Access-Control-*等的头信息,如果需要将cookies传输 ...
- [JAVA IDEA]在使用maven项目中,无法读取resources文件夹中的配置文件的一种解决方案
1.在通过配置文件来连接数据库时,在resouces文件中放入了db.properties配置文件,但无法正常读取到 读取配置文件信息的代码: InputStream input=JdbcUtil.c ...
- 高性能分布式锁-redisson的使用
1,概述:在一些高并发的场景中,比如秒杀,抢票,抢购这些场景,都存在对核心资源,商品库存的争夺,控制不好,库存数量可能被减少到负数,出现超卖的情况,或者 产生唯一的一个递增ID,由于web应用部署在多 ...
- Linux上把新磁盘扩展到已有分区中(基于LVM)
0.在不重启服务器的前提下找到新加的磁盘 --查看主机总线号 ls /sys/class/scsi_host/ --根据查询结果生成刷新磁盘语句 echo "- - -" > ...
- 有标号的DAG计数系列问题
传送门 II 设 \(f_i\) 表示 \(i\) 个点的答案 那么枚举至少 \(j\) 个点的出度为 \(0\) \[\sum_{j=0}^{i}(-1)^j\binom{i}{j}f_{i-j}2 ...
- chrome:插件、跨域、调试....
chrome 调试小技巧 ctrl+shift+c 打开chrome的控制台选中一个元素,然后在控制台输入$0即可获取选中的元素,就可以对其进行操作了. $0.addEventListener(... ...
- springmvc和spring的区别
springmvc只是spring其中的一部分.spring 可以 支持 hibernate ,ibatis ,JMS,JDBC 支持事务管理, 注解功能,表达式语言,测试springmvc 就是一个 ...
- Python删除开头空格
# -*- coding: utf-8 -*- '''打开delSpace.txt文本并删除每行开头的八个空格''' f=open("delSpace.txt") lines=f. ...