我正在尝试创建一个连接到ngModel的动态表单，允许用户根据需要添加更多控件 . 正如下图所示：
除非在删除上一个输入的内容时添加一组新控件，否则表单的行为与预期相同 . 即使模型没有改变 . 我创建了这个plunkr以展示我正在谈论的行为 .
这是我写的html模板：
<tr *ngFor="let work of works; let i = index">
<td>
<select required id="cliente" class="form-control" [(ngModel)]="work.operation" name="operation">
<option>Operation 1</option>
<option >Operation 2</option>
</select>
</td>
<td>
<input required type="number" class="form-control" [(ngModel)]="work.cost"
name="cost">
</td>
<td>
<input required id="horas_maquina_previstas" type="number" class="form-control" [(ngModel)]="work.hours"
name="hours">
</td>
<td>
<button type="button" class="btn btn-danger btn-circle" (click)="removeWork(i)">Remove</button>
</td>
</tr>
和打字稿组件定义：
import {Component, ChangeDetectionStrategy} from '@angular/core'
@Component({
selector: 'my-app',
templateUrl: 'src/app.html'
})
export class App {
works = [];
addWork(){
this.works.push({});
}
removeWork(index){
this.works.splice(index, 1);
}
get diagnostic() {
return JSON.stringify(this.works);
}
}
我无法理解这种行为，我发现的所有相关问题都是关于角度的旧版本，没有一个有类似的问题 .
谢谢！
1 回答
您的控件需要唯一的名称才能在Angular2中正常工作 . 所以做以下事情：