angular - angular 5入力を動的に追加し、複数のアイテムをサーバーに送信します

Question

サーバーのAngular 5プロジェクトデータベースに保存するには、複数のアイテムを受け取る必要があります..

角度のある側で、複数のアイテムを渡すフォームを作成しようとしています...

ユーザーが別のアイテムを追加するために別の入力を追加するときにボタンが必要です。ほとんど完了しましたが、入力を一緒に保持する方法がわかりません。これをリンクしようとしましたが、うまくいきません。

私のコンポーネント:

export class RequirementFormComponent implements OnInit {

  private requirment: Requirement;
  orderForm: FormGroup;
  items: FormArray;

  constructor(private form: FormDataService, private formBuilder: FormBuilder, private router: Router) {
  }

  ngOnInit() {
    this.requirment = this.form.getRequirment();

    this.orderForm = this.formBuilder.group({
      items: this.formBuilder.array([this.createItem()])
    });

  }

  addItem(): void {
    this.items = this.orderForm.get('items') as FormArray;
    this.items.push(this.createItem());
  }
}
  createItem(): FormGroup {
return this.formBuilder.group({
  item: '',
});

}

html :

<ul class="eff">
  <li>
    <div>
      <form [formGroup]="orderForm"  class="editForm" novalidate>
        <div class="input-field" *ngFor="let item of orderForm.get('items').controls; let i = index;">

          <input class="form-control" formControlName="items" [ngModel]="item"
                 type="text"  maxlength="50">
        </div>

      </form>
    </div>
  </li>
</ul>