title: Angular 2 - How to validate form?
body: <p>I have this form</p>
  
  <pre><code>@Component({
      template: `
          &lt;form [formGroup]="formGroup" (ngSubmit)="onSubmit()" novalidate&gt;
              &lt;input name="detail" id="detail" formControlName="detail"&gt;&lt;/input&gt;
              &lt;div *ngIf="formGroup.controls['detail'].dirty &amp;&amp; formGroup.controls['detail'].invalid"&gt;This is required&lt;/div&gt;
              &lt;button type="submit" &gt;Post&lt;/button&gt;
          &lt;/form&gt;
      `,
  })
  export class CreateDiscussionComponent {
      formGroup: FormGroup;
      submitted: boolean = false;
      constructor(
      ) {
          this.formGroup = new FormGroup({
              detail: new FormControl('', [Validators.required, Validators.minLength(2) ]),
          });
      }
      onSubmit(): void {
          this.submitted = true;
          console.log( this.submitted)
      }
  }
  </code></pre>
  
  <p>what it does is, submit the form when I click submit or enter.</p>
  
  <p>Problem: when I submit empty value, it will allow submitting. Which is bad.</p>
  
  <p>It should not allow and show the error.</p>