使用响应式编程在 Angular 中处理表单

Question

我想知道，在 formcontrol 编号不固定的情况下，处理表单的角度方式是什么，如下所示。例如。

<ngForm #formData onsubmit="getEditedData(formData)">
  <textarea
        class="elm-textarea "
        placeholder="Name"
        maxlength="200"
        [value]="questionAnsData.id"
      ></textarea>
      <div *ngFor="let question of questionAnsData.questions; let i = index">
        <label class="label">Question {{ i + 1 }}</label>
        <textarea
          class="elm-textarea "
          placeholder="Question {{ i + 1 }}"
          maxlength="200"
          [value]="question"
        ></textarea>
      </div>
      <div *ngFor="let answer of questionAnsData.answers; let j = index">
        <label class="label">Answer {{ j + 1 }}</label>
        <textarea
          class="elm-textarea "
          placeholder="Answer {{ j + 1 }}"
          maxlength="200"
          [value]="answer"
        ></textarea>
      </div>
</ngForm>

我的数据集是 -

questionAnsData = [{
    id: "set1",
    questions: ["Hello, how are you?", "Hi, how are you?", ", how are you?" ],
    answers: ["Good", "I am good"]
  }];

Stackblitz link 提前致谢。

Answer 1

您可以从反应式表单中使用 FormArray 并在那里推送您需要的任意数量的控件 带有example的文章