[Angular] Updating and resetting FormGroups and FormControls
If you want to reset or just update field value, you can do:
reset: reset({key: value, k2:v2});
update:
1. patchValue({k: v}); update part of form fields
2. setValue({k:v, k1: v1...}); update whole form fields.
reset:
onAdd() {
this.added.emit(this.parent.get('selector').value);
this.parent.get('selector')
.reset({
quantity: ,
product_id: ''
})
}
All the 'dirty, touched, valid' props on form will also be reset.
Update:
onAdd() {
this.added.emit(this.parent.get('selector').value);
this.parent.get('selector')
.patchValue({
product_id: ''
})
}
For 'patchValue', we only need to update part of props, not all of them.
onAdd() {
this.added.emit(this.parent.get('selector').value);
this.parent.get('selector')
.setValue({
quantity: ,
product_id: ''
})
}
For 'setValue', you have to update all the fields, otherwise it will throw error.
[Angular] Updating and resetting FormGroups and FormControls的更多相关文章
- angular reactive form
这篇文章讲了angular reactive form, 这里是angular file upload 组件 https://malcoded.com/posts/angular-file-uploa ...
- 2015前端各大框架比较(angular,vue,react,ant)
前端流行框架大比拼 angular vue react ant-design angularjs angular是个MVVM的框架.针对的是MVVM这整个事.angular的最主要的场景就是单页应用, ...
- Angular DirtyChecking(脏值检查) $watch, $apply, $digest
Dirty Checking (脏值检查) Digest cycle and $scope Digest cycle and $scope First and foremost, AngularJS ...
- [转]Angular: Hide Navbar Menu from Login page
本文转自:https://loiane.com/2017/08/angular-hide-navbar-login-page/ In this article we will learn two ap ...
- Angular 2 to Angular 4 with Angular Material UI Components
Download Source - 955.2 KB Content Part 1: Angular2 Setup in Visual Studio 2017, Basic CRUD applicat ...
- react和vue,angular的比较
就这几天我所了解到react情况和大家探讨一下子react的知识: react由facebook团队维护的一套框架,已经应用在instagram网站上了,react以其独特的性能优化方案,正在被越来越 ...
- Angular基础(五) 内建指令和表单
Angular提供了一些内建的指令,可以作为属性添加给HTML元素,以动态控制其行为. 一.内建指令 a) *ngIf,可以根据条件来显示或隐藏HTML元素. <div *ngIf='a&g ...
- TWO PHASES OF ANGULAR 2 APPLICATIONS
Angular 2 separates updating the application model and reflecting the state of the model in the view ...
- CHANGE DETECTION IN ANGULAR 2
In this article I will talk in depth about the Angular 2 change detection system. HIGH-LEVEL OVERVIE ...
随机推荐
- Maven搭建hadoop环境报Missing artifact jdk.tools:jdk.tools:jar:1.7
今天,更新了工程,报错了. 项目中用了HBase,也有Hadoop相关的jar配置. pom文件, Missing artifact jdk.tools:jdk.tools:jar:1.7 Maven ...
- 洛谷 P1223 排队接水
洛谷 P1223 排队接水 题目描述 有n个人在一个水龙头前排队接水,假如每个人接水的时间为Ti,请编程找出这n个人排队的一种顺序,使得n个人的平均等待时间最小. 输入输出格式 输入格式: 输入文件共 ...
- 洛谷——P3817 小A的糖果
https://www.luogu.org/problem/show?pid=3817 题目描述 小A有N个糖果盒,第i个盒中有a[i]颗糖果. 小A每次可以从其中一盒糖果中吃掉一颗,他想知道,要让任 ...
- 洛谷 P1760 通天之汉诺塔
P1760 通天之汉诺塔 题目背景 直达通天路·小A历险记第四篇 题目描述 在你的帮助下,小A成功收集到了宝贵的数据,他终于来到了传说中连接通天路的通天山.但是这距离通天路仍然有一段距离,但是小A突然 ...
- 洛谷 P1208 [USACO1.3]混合牛奶 Mixing Milk
P1208 [USACO1.3]混合牛奶 Mixing Milk 题目描述 由于乳制品产业利润很低,所以降低原材料(牛奶)价格就变得十分重要.帮助Marry乳业找到最优的牛奶采购方案. Marry乳业 ...
- 早该知道的 7 个JavaScript 技巧[转]
简洁写法 对象的简写在过去,如果你想创建一个对象,你需要这样: var car = new Object(); car.colour = 'red'; car.wheels = 4; car.h ...
- 谈谈Command对象与数据检索
摘要 到目前为止,我相信大家对于ADO.NET如何与外部数据源建立连接以及如何提高连接性能等相关知识已经牢固于心了.连接对象作为ADO.NET的主力先锋,为用户与数据库交互搭建了扎实的桥梁.它的一生是 ...
- 【河南省多校脸萌第六场 E】LLM找对象
[链接]点击打开链接 [题意] 在这里写题意 [题解] 把n个时间离散化一下. 对于不是相邻的点,在两者之间再加一个空格就好. 这样最多会有1000个位置. 则定义dp[i][k][j] 表示前i个数 ...
- LeetCode_Construct Binary Tree from Preorder and Inorder Traversal
一.题目 Construct Binary Tree from Preorder and Inorder Traversal My Submissions Given preorder and ino ...
- Dcloud课程1 APP的架构有哪些
Dcloud课程1 APP的架构有哪些 一.总结 一句话总结:B/S架构和C/S构架 1.APP的分类? 主流的四大APP系统:1.苹果ios系统版本,开发语言是Objective-C:2.微软Win ...