title: ngSubmit not working
body: <p>I have an angular 4 form where I am trying to submit data </p>
  
  <p><strong>HTML Code</strong></p>
  
  <pre><code>&lt;form class="form-horizontal"   [formGroup]="signupForm" 
  (ngSubmit)="onFormSubmit()" &gt;
  &lt;fieldset&gt;
    &lt;legend&gt;Scheduler&lt;/legend&gt;
      &lt;!--- Gender Block --&gt;
      &lt;div class="form-group"&gt;
      &lt;label for="scheduleJob"&gt;Schedule Job&lt;/label&gt;
      &lt;input type="text" formControlName = "schedulejob"
        id="scheduleJob"
        placeholder="Schedule Job"&gt;
  </code></pre>
  
  <p><strong>Button code</strong></p>
  
  <pre><code> &lt;div class="form-group"&gt;
          &lt;button type="reset" class="btn btn-default"&gt;Cancel&lt;/button&gt;           
          &lt;button type="submit"  class="btn btn-primary"&gt;Submit&lt;/button&gt;          
  
      &lt;/div&gt;
  </code></pre>
  
  <p><strong>Scheduler.TS file</strong></p>
  
  <pre><code>import { Component, OnInit } from '@angular/core';
  import { Scheduler } from 'rxjs/Scheduler';
  /* Import FormControl first */
  import { FormBuilder, FormGroup, Validators } from '@angular/forms';
  
  @Component({
    selector: 'app-scheduler',
    templateUrl: './scheduler.component.html',
    styleUrls: ['./scheduler.component.css']
  })
  export class SchedulerComponent implements OnInit {
  
    //Gender list for the select control element
   private scheduleTypeList: string[];
   //Property for the user
   private scheduler:Scheduler;
  
   private signupForm: FormGroup;
  
   constructor(private fb:FormBuilder) { } 
  
    ngOnInit() {   
  
      this.scheduleTypeList =  ['Type 1', 'Type 2', 'Type 3'];
      this.signupForm  = this.fb.group({
        schedulejob:  ['', Validators.required] ,               
        frequency: ['', Validators.required],
        days: ['', Validators.required],
        zone: ['', Validators.required],
        schedulerjobtype:['', Validators.required]
    })  
    } 
    public onFormSubmit() {
      this.scheduler = this.signupForm.value;
      if(this.signupForm.valid) {
          this.scheduler = this.signupForm.value;
          console.log(this.scheduler);
        // alert(this.scheduler);
          /* Any API call logic via services goes here */
      }
      //alert(this.scheduler);
      console.log(this.scheduler);
  }
  }
  </code></pre>
  
  <p><em>Why is the execution not passed to onFormSubmit on submit click and alert or console.log not printing values?</em></p>