小编dil*_*p t的帖子

如何在 Angular 中单击按钮时将 FormControl 动态添加到 FormArray?

如何formcontrol(option)动态添加formarray? 我想动态地将问题添加到formarray. 单击按钮后,它应该更新显示。我正在使用角度 7。

组件代码

ngOnInit() {
  this.quizForm = this.fb.group({
    questions: this.fb.array([]),
    questions2: this.fb.array([]),
  });
}
    
//creating formcontrol
createItem(): FormGroup {
  return this.fb.group({
    ques: '',
  });
}
    
//pushing code
genField() {
  this.message = true;
  this.questions = this.quizForm.get('questions') as FormArray;
  this.questions.push(this.createItem());
}
Run Code Online (Sandbox Code Playgroud)

HTML模板

我想在按钮单击时动态添加表单控件选项,并且表单控件应该在formArrayName="questions".

<form [formGroup]="quizForm" class="adjust-form">
  <div formArrayName="questions" 
    *ngFor="let item of quizForm.get('questions').controls; let i = index;">
    <div class="col-md-10 col-sm-6 mt-3 mb-3" [formGroupName]="i">
      <label>{{i +1}} - {{question}} </label>
      <i class="flaticon-delete"    
          (click)="quizForm.get('questions').controls.splice(i,1) "
          style="font-size: …
Run Code Online (Sandbox Code Playgroud)

angular-material angular angular-forms

5
推荐指数
1
解决办法
2万
查看次数

标签 统计

angular ×1

angular-forms ×1

angular-material ×1