title: Nothing happens on touched event in angular 7
body: <pre><code> &lt;div class="register_input"&gt;
         &lt;span class="red"&gt;*&lt;/span&gt;
         &lt;label&gt;First Name&lt;/label&gt;
         &lt;input maxlength="30" formControlName="firstName" type="text" required&gt;
         &lt;p&gt;{{contactUsForm.value | json}}&lt;/p&gt;
         &lt;p *ngIf="firstName.touched"&gt;Touched&lt;/p&gt;
   &lt;/div&gt;
  </code></pre>
  
  <p>Component Snippet:</p>
  
  <pre><code>import {Component} from "@angular/core";
  import {Router} from '@angular/router';
  import {FormControl, FormGroup, FormBuilder,Validators} from '@angular/forms';
  @Component({
    selector:'contact us',
    templateUrl:'./contact-us.component.html'
  })
  export class ContactUsComponent {
    contactUsForm: FormGroup;
    constructor( private route: Router, private formBuilder: FormBuilder) {
    }
    ngOnInit(){
        this.main();
    }
  
    main() {
      this.contactUsForm = this.formBuilder.group({
      firstName: '',
      lastName: '',
      email: '',
      phoneNumber:''
    });
    }
  </code></pre>
  
  <p>the <code>&lt;p&gt;</code> doesn't appear when I click on the input or even if I enter text. I am using a reactive form. I have added the component also.</p>