title: How to find the invalid controls in Angular(v2 onwards) reactive form
body: <p>I have a reactive form in Angular like below:</p>
  
  <pre class="lang-ts prettyprint-override"><code>this.AddCustomerForm = this.formBuilder.group({
      Firstname: ['', Validators.required],
      Lastname: ['', Validators.required],
      Email: ['', Validators.required, Validators.pattern(this.EMAIL_REGEX)],
      Picture: [''],
      Username: ['', Validators.required],
      Password: ['', Validators.required],
      Address: ['', Validators.required],
      Postcode: ['', Validators.required],
      City: ['', Validators.required],
      Country: ['', Validators.required]
  });
  
  createCustomer(currentCustomer: Customer) 
  {
      if (!this.AddCustomerForm.valid)
      {
          //some app logic
      }
  }
  </code></pre>
  
  <p>this.AddCustomerForm.valid returns false, but everything looks good. </p>
  
  <p>I have tried to find with checking the status property in the controls collection. But I wonder if there is a way to find the invalid ones and display to the user?</p>