title: Handling number input types such as tel or time in angular 6 reactive forms?
body: <p>Below you will see my template/ Html form, however, the validator does not allow me to process the inputs as strings? Can you please explain what I am missing? The obvious text inputs are handled and validated but I couldn't find an example of how you can handle number input types such as telephone and time. Can we use the toString() javascript method somewhere to convert them to string?
  HTML Code Sample</p>
  
  <pre><code>&lt;mat-form-field&gt;
    &lt;input matInput type="text" formControlName="title" placeholder="Student Name"&gt;
    &lt;mat-error *ngIf="form.get('title').invalid"&gt;Please enter a Student Name.&lt;/mat-error&gt;
  &lt;/mat-form-field&gt;
  &lt;mat-form-field&gt;
    &lt;input matInput type="tel" formControlName="telephone" placeholder="telephone"&gt;
    &lt;mat-error *ngIf="form.get(telephone).invalid"&gt;Please enter a telephone.&lt;/mat-error&gt;
  &lt;/mat-form-field&gt;
  &lt;mat-form-field&gt;
    &lt;input matInput type="Time" formControlName="pickUpTime" placeholder="PickUp Time"&gt;
    &lt;mat-error *ngIf="form.get('pickUpTime').invalid"&gt;Please enter a Pickup Time.&lt;/mat-error&gt;
  &lt;/mat-form-field&gt;
  &lt;mat-form-field&gt;
    &lt;input matInput type="Time" formControlName="dropOffTime" placeholder="DropOff Time"&gt;
    &lt;mat-error *ngIf="form.get('dropOffTime').invalid"&gt;Please enter a Dropoff Time.&lt;/mat-error&gt;
  &lt;/mat-form-field&gt;
  </code></pre>
  
  <p>Component.ts file to configure reactive form:</p>
  
  <pre><code>ngOnInit() {
  this.form = new FormGroup({
    title: new FormControl(null, {
      validators: [Validators.required, Validators.minLength(3)]
    }),
    telephone: new FormControl(null,{
      validators: [
        Validators.required,
        Validators.minLength(5) ]
    }),
    pickUpTime: new FormControl(null, {
      validators: [
        Validators.required,
        Validators.minLength(5) ]
    }),
    dropOffTime: new FormControl(null, {
      validators: [
        Validators.required,
        Validators.minLength(5) ]
    })
  </code></pre>