以角度动态形式添加新的键值对
以角度动态形式添加新的键值对
提问于 2019-02-16 20:35:06
我有一个角度动态形式的要求添加键-值对，点击添加button.Both键和值应该是可编辑的。
( a)-键，我们可以从主列表中选择，也可以是一个免费的文本框(如果主列表中没有可用的值，那么应该用textbox替换自动完成)。
b)-值应该是一个文本框。
此外，应该有一个附近的“保存”按钮和“删除”按钮以及上面的字段来提交或删除它。
根据我们项目中当前的实现，'key‘总是硬编码的，'value’在表单组中是可编辑的。
以动态形式添加新的键值对的最佳方法应该是什么？
1-我们是否需要创建一个新的表单组来添加新的行？
2-使用当前的方法并在相同的窗体组中扩展其功能。
任何方法/线索都将受到欢迎。
回答 1
Stack Overflow用户
发布于 2019-02-16 21:12:11
1 .On按钮单击创建创建窗体组的函数，并在父FormGroup中添加到窗体数组
- 对于如下的键值
let r=this.fb.group({mvl:"keey",sec:"val"});- 将您的输入标记为只读，使其不可食用
foo:FormGroup
constructor(public fb:FormBuilder) {
this.foo=this.fb.group({
string :"",
number:0,
common1:this.common,
common2:this.common,
multi:this.fb.array([])
});
}
add()
{
let r=this.fb.group({mvl:"keey",sec:"val"});
(this.foo.get("multi") as FormArray).push(r);
}在表单中放置html，如下所示
<div formArrayName="multi">
<div *ngFor="let el of multiForm;let i=index" [formGroupName]="i">
<input type="text" matInput placeholder="mvl{{i}}" formControlName="mvl">
<input type="text" matInput placeholder="sec{{i}}" formControlName="sec">
</div>
<div (click)="add()">add</div>
</div>页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/54727401
复制相关文章
相似问题
腾讯云开发者
