title: Get Angular 2 Form object in typescript class file to set form properties manually
body: <p>I have a form within a prime ng dialogue control. I don't want to use ngSubmit method in form tag as I have two submit methods depends on some value for this form. I want to manually set this form's submit property on typescript class file. How can I get that form object in ts file to set its "submitted" or "valid" properties manually and take decision based on those? In a word how can I get control of this form in my class file to set or get its internal properties.</p>
  
  <p><strong>Html:</strong></p>
  
  <pre><code>&lt;p-dialog header="Create New Message" [(visible)]="IsShowNewMessageDialog"
        modal="modal" width="800" height="auto" styleClass="modal-blue" appendTo="body"&gt;
  &lt;form #f="ngForm" name="newMessageForm" (ngSubmit)="f.form.valid" novalidate autocomplete="off"&gt;
      &lt;div *ngIf="model &amp;&amp; IsShowNewMessageDialog"&gt;
          &lt;div class="ui-g"&gt;
              &lt;div class="ui-g-11"&gt;
                  &lt;span style="color:red"&gt;{{ErrorMessage}}&lt;/span&gt;
              &lt;/div&gt;
          &lt;/div&gt;
  
          &lt;div class="ui-g"&gt;
              &lt;div class="ui-g-2"&gt;&lt;label class=""&gt;To&lt;/label&gt;&lt;/div&gt;
              &lt;div class="ui-g-10" [ngClass]="{ 'has-error':  f.submitted &amp;&amp; !emailTo.valid }"&gt;
                  &lt;input type="text" [(ngModel)]="model.emailTo" #emailTo="ngModel"
                         class="text-field"
                         pInputText name="emailTo"
                         placeholder="Email To *" minlength="3"
                         required&gt;
              &lt;/div&gt;
          &lt;/div&gt;
  
          &lt;div class="ui-g"&gt;
              &lt;div class="ui-g-2"&gt;&lt;label class=""&gt;CC&lt;/label&gt;&lt;/div&gt;
              &lt;div class="ui-g-10"&gt;
  
                  &lt;input type="text" [(ngModel)]="model.cC" #CC="ngModel"
                         class="text-field"
                         pInputText name="CC"
                         placeholder="CC" minlength="3"&gt;
              &lt;/div&gt;
          &lt;/div&gt;
  
          &lt;div class="ui-g"&gt;
              &lt;div class="ui-g-2"&gt;&lt;label class=""&gt;Bcc&lt;/label&gt;&lt;/div&gt;
              &lt;div class="ui-g-10"&gt;
  
                  &lt;input type="text" [(ngModel)]="model.bcc" #BCC="ngModel"
                         class="text-field"
                         pInputText name="BCC"
                         placeholder="BCC" minlength="3"&gt;
              &lt;/div&gt;
          &lt;/div&gt;
  
          &lt;div class="ui-g"&gt;
              &lt;div class="ui-g-2"&gt;&lt;label class=""&gt;Subject&lt;/label&gt;&lt;/div&gt;
              &lt;div class="ui-g-10" [ngClass]="{ 'has-error': f.submitted &amp;&amp; !subject.valid }"&gt;
                  &lt;input type="text" [(ngModel)]="model.subject" #subject="ngModel"
                         class="text-field"
                         pInputText name="subject"
                         placeholder="Subject *" minlength="3"
                         required&gt;
              &lt;/div&gt;
          &lt;/div&gt;
  
          &lt;div class="ui-g"&gt;
              &lt;div class="ui-g-12"&gt;
                  &lt;p-editor name="emailBodyPlain" #emailBodyPlain="ngModel" [(ngModel)]="model.emailBodyPlain"
                            placeholder="Email Body *" [style]="{'height':'320px'}"
                            minlength="3"&gt;&lt;/p-editor&gt;
  
              &lt;/div&gt;
          &lt;/div&gt;
  
      &lt;/div&gt;
  
      &lt;div class="text-right pr-5"&gt;
          &lt;button class="btn btn-warning" type="button"
                  [disabled]="!f.form.valid"
                  (click)="sendNewMail(false)" label="Send"&gt;
              &lt;i class="fa fa-paper-plane"&gt;&lt;/i&gt;&amp;nbsp;Send
          &lt;/button&gt;
          &lt;button class="btn btn-warning" type="button"
                  [disabled]="!f.form.valid"
                  (click)="saveNewMail(true)" label="Save"&gt;
              &lt;i class="fa fa-floppy-o"&gt;&lt;/i&gt;&amp;nbsp;Save
          &lt;/button&gt;
      &lt;/div&gt;
  &lt;/form&gt;
  &lt;/p-dialog&gt;
  </code></pre>
  
  <p><strong>Submit Method:</strong></p>
  
  <pre><code>saveNewMail(isDraft) {
      this.messageCenterService.saveNewMail(this.newMail)
          .subscribe(
          data =&gt; {
              this.IsShowNewMessageDialog = false;
          },
          error =&gt; {
              this.ErrorMessage = error.Message;
          });
  }
  </code></pre>