- c - 在位数组中找到第一个零
- linux - Unix 显示有关匹配两种模式之一的文件的信息
- 正则表达式替换多个文件
- linux - 隐藏来自 xtrace 的命令
在我的应用程序中,我使用 Reactive Forms 制作了一个表单。在我的应用程序中,他们是一个按钮 Add new Fields
单击此按钮添加新字段。
我可以添加新字段,但无法分配 formControlName
。
任何人都可以告诉我正确的路径如何将 formControlName
添加到这些动态添加的字段中。
最佳答案
您有 FormGroup
数组的 formArray
。
所以使用 formArrayName
和 formGroupName
的循环与 formControlName(itemDetail, quantity, rate...)
<table formArrayName="salesList">
<tr>
<th>Item Detail</th>
<th>Quantity</th>
<th>Rate</th>
<th>Tax</th>
<th>Amount</th>
</tr>
<!--Input controls -->
<tr *ngFor="let saleList of salesListArray.controls;let i = index" [formGroupName]="i">
<td>
<div class="col-sm-6">
<input class="form-control" type="text" placeholder="Item Detail" formControlName = "itemDetail"/>
</div>
</td>
<td>
<div class="col-sm-6">
<input class="form-control" type="text" placeholder="0" formControlName = "quantity" />
</div>
</td>
<td>
<div class="col-sm-6">
<input class="form-control" type="text" placeholder="0.00" formControlName = "rate"/>
</div>
</td>
<td>
<div class="col-sm-6">
<input class="form-control" type="text" placeholder="Select a tax" formControlName = "tax"/>
</div>
</td>
<td>
<div class="col-sm-6">
<span>{{saleList.amount}}}</span>
</div>
</td>
</tr>
</table>
另见
关于angular - 如何将 formControlName 赋予 FormArray 对象 - Angular 2 (ReactiveFormsModule),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/44697231/
我在 Angular 4 中有这个主要模块: @NgModule({ imports: [ //.. other modules ReactiveFormsMo
我正在尝试在项目中使用 ReactiveFormsModule。所以我将它添加到 app.module.ts: import { NgModule }
我一直在开发我的应用程序。我想使用 ReactiveFormsModule 模块,但我得到了 Error: Unexpected module 'ReactiveFormsModule' declar
这个问题在这里已经有了答案: Angular 5 FormGroup reset doesn't reset validators (14 个答案) 关闭 4 年前。 我在下面的代码中只提交了一些详
我的 Angular 版本是这样的: Angular cli version 我创建了一个组件,它的名字是 Register我运行 ng serve whole angular project 抛出这
我正在尝试在 Angular 中创建响应式(Reactive)表单。 这是我的登录表单。 Username Password
我是 angularJS2 的新手,我正在尝试使用 ReactiveFormsModule 学习 angularJS2 表单中的验证。现在我一直在研究如何在 angularJS2 中验证单选按钮 这是
存在 ReactiveFormModule 和 FormsModule。 import { FormsModule, ReactiveFormsModule } from "@angular/
我在这里阅读了一篇写得很好的关于 Angular 模块加载的文章 - https://medium.com/@cyrilletuzi/understanding-angular-modules-ngm
我是 Angular2 的新手(昨天开始),在此之前我不是 Angular 用户。我的问题是如何以两种方式将数组绑定(bind)到 ReactiveFormsModule 中的复选框?下面是我缺失的拼
我一直在寻找这个问题的答案,每个人都说只需将 ReactiveFormsModule 添加到模块中即可解决。问题是无法识别 [formGroup]。我发现的解决方案说我只需要将导入添加到模块中,但它根
TestBed.configureTestingModule({ imports: [ FormsModule, ReactiveFormsModule,
所以我正在尝试为一个组件编写一个非常基本的测试。我只是想确保我使用 FormBuilder 创建的表单是 FormGroup 的一个实例,但我一直收到 NullInjectorerror:没有 For
在我的应用程序中,我使用 Reactive Forms 制作了一个表单。在我的应用程序中,他们是一个按钮 Add new Fields 单击此按钮添加新字段。 我可以添加新字段,但无法分配 formC
我收到此错误 - “模板解析错误:NgControl 没有提供者” The error comes from this line of code --> {{money.Curr
我刚看到这个question但我仍然有同样的错误。我有一个共享模块,我将其导入到我的功能模块中。但我也尝试过将 FormsModule、ReactiveFormsModule 模块直接导入到我的功能模
我是一名优秀的程序员,十分优秀!