title: Is it possible to pass form valid reference to ng-template in angular
body: <p>I'm using Angular 8 and I have the below code structure.</p>
  <pre><code>&lt;div class=&quot;addForm&quot; *ngIf=&quot;activeForm == 1&quot;&gt;
      &lt;form [formGroup]=&quot;addForm1&quot;&gt;
          &lt;div&gt;
              ---
              ---
              &lt;!-- footer area --&gt;
              &lt;ng-container *ngTemplateOutlet=&quot;submitCancelAndReset;context:{isValid: this.addForm1.valid}&quot;&gt;&lt;/ng-container&gt;
          &lt;/div&gt;
      &lt;/form&gt;
  &lt;/div&gt;
  &lt;div class=&quot;addForm&quot; *ngIf=&quot;activeForm == 2&quot;&gt;
      &lt;form [formGroup]=&quot;addForm2&quot;&gt;
          &lt;div&gt;
              ---
              ---
              &lt;!-- footer area --&gt;
              &lt;ng-container *ngTemplateOutlet=&quot;submitCancelAndReset;context:{isValid: this.addForm2.valid}&quot;&gt;&lt;/ng-container&gt;
          &lt;/div&gt;
      &lt;/form&gt;
  &lt;/div&gt;
  &lt;div class=&quot;addForm&quot; *ngIf=&quot;activeForm == 3&quot;&gt;
      &lt;form [formGroup]=&quot;addForm3&quot;&gt;
          &lt;div&gt;
              ---
              ---
              &lt;!-- footer area --&gt;
              &lt;ng-container *ngTemplateOutlet=&quot;submitCancelAndReset;context:{isValid: this.addForm3.valid}&quot;&gt;&lt;/ng-container&gt;
          &lt;/div&gt;
      &lt;/form&gt;
  &lt;/div&gt;
      
  </code></pre>
  
  <pre><code>&lt;ng-template #submitCancelAndReset let-isValid=&quot;isValid&quot;&gt;
      ---
      ---
      &lt;button type=&quot;submit&quot; [disabled]=&quot;!isValid&quot;&gt;SAVE&lt;/button&gt;
      ---
      ---
  &lt;/ng-template&gt;
  </code></pre>
  <p>Here, the footer area is same for all three forms and so I created a common ng-template which includes a submit button with dynamic disabled property. Now I need to pass each form's valid state as input parameter to the ng-template, which will bind to the disabled property..
  Is that possible?</p>