Angular 6 for Enterprise-Ready Web Applications

Adding and verifying components

We will be creating a citySearch component using Material form and input modules:

1. Add MatFormFieldModule and MatInputModule to material.module so that it becomes available for use in the app:

src/app/material.module.tsimport {  ...  MatFormFieldModule,  MatInputModule,} from '@angular/material'...@NgModule({  imports: [    ...    MatFormFieldModule,    MatInputModule,  ],  exports: [    ...    MatFormFieldModule,    MatInputModule,  ],})

We're adding MatFormFieldModule, because each input field should be wrapped in a <mat-form-field> tag to get the most out of Angular Material functionality. At a high-level, <form> encapsulates numerous default behaviors for keyboard, screen-reader, and browser extension users; <mat-form-field>