title: How to submit a dynamically created form in Angular
body: <p>I have a form with many input fields that is dynamically created through binding:</p>
  
  <pre><code>&lt;form method="post" (ngSubmit)="onSubmit()"&gt;
  &lt;div class="row"&gt;
    &lt;div *ngFor="let p of Model.products" class="col-lg-2 col-md-4 col-sm-6" style="text-align:center"&gt;
      &lt;p&gt;{{p.name}}&lt;/p&gt;
      &lt;input name="stock:{{p.id}}" value="{{p.stock}}" type="text" class="form-control" autocomplete="off" onkeypress="return event.charCode &gt;= 48 &amp;&amp; event.charCode &lt;= 57" /&gt;
      &lt;img src="{{p.imgPath}}" style="max-width:120px" /&gt;
    &lt;/div&gt;
  &lt;/div&gt;
  &lt;div style="text-align:right"&gt;
    &lt;button type="submit" class="btn btn-outline-primary"&gt;Submit&lt;/button&gt;
  &lt;/div&gt;
    &lt;/form&gt;
  </code></pre>
  
  <p>How do I submit this form since I don't know the names of the inputs in advance.
  What should go in my onSubmit() event handler?</p>
  
  <p>Here is the code of the component:</p>
  
  <pre><code>import { Component, Inject, OnInit } from "@angular/core";
  import { HttpClient } from "@angular/common/http";
  import { AuthService } from "../services/auth.service";
  
  @Component({
    selector: "admin-stocks",
    templateUrl: "stocks.component.html"
  })
  
  export class AdminStocksComponent implements OnInit{
    Model: ProductListModel;
    IsAdministrator: boolean = false;
    constructor(@Inject("BASE_URL") private baseUrl: string, private http: HttpClient,
                   private authService: AuthService) { }
  
    ngOnInit() {
      this.authService.isAdministrator().subscribe(res =&gt; this.IsAdministrator = res,
        error =&gt; console.error(error));
  
      var url = this.baseUrl + "api/ajax/GetProducts";
      this.http.get&lt;ProductListModel&gt;(url).subscribe(res =&gt; { console.log(res); this.Model = res; },
        error =&gt; console.error(error));
    }
    getPagesArray(n) {
      return new Array(n);
    }
    onSubmit(e) {
      console.log(e);
  
    }
  }
  </code></pre>