title: Form validation for dynamic table tr angular 5
body: <p>I have dynamic <code>table tr</code> and each row contains a submit button. I also applied <code>input</code> control name dynamically. What is the best way to enable/ disable button based on the <code>tr</code> row validation?</p>
  
  <pre><code>&lt;form #form1="ngForm"&gt;
  &lt;table&gt;
  &lt;thead&gt;&lt;tr&gt;&lt;th&gt;Name&lt;/th&gt;&lt;th&gt;Email&lt;/th&gt;&lt;th&gt;Action&lt;/th&gt;&lt;/tr&gt;&lt;/thead&gt;
  &lt;tbody&gt;
  &lt;tr *ngFor="let value of data; let i=index"&gt;
  &lt;td&gt;&lt;input type="text" name="name{{i}}" #nameInput="ngModel" [(ngModel)]="dataModel.name" [value]="value.name" required /&gt;&lt;/td&gt;
  &lt;td&gt;&lt;input type="text" name="email{{i}}" #emailInput="ngModel" [(ngModel)]="dataModel.email" [value]="value.email" required /&gt;&lt;/td&gt;
  &lt;td&gt;&lt;button type="submit" [disabled]="form1.form.invalid"&gt;Submit&lt;/button&gt;&lt;/td&gt;
  &lt;/tr&gt;
  &lt;/tbody&gt;
  &lt;/table&gt;
  &lt;/form&gt;
  </code></pre>
  
  <p>Here, above <code>[disabled]</code> condition applies for all rows but i want to apply it based on the each row.</p>