Build Reactive Websites with RxJS

Displaying Returned Data

Open search-header.component.ts, which was generated for you earlier, along with its template search-header.component.html. In the template, you can see that the input element has a [formControl] attribute. You’ll learn more about FormControl and the related services in Chapter 7, ​Building Reactive Forms in Angular​. For now, all we need to know is that it’s an observable that emits the current value of the search bar whenever the value of the input element changes. Your first task is to connect the input element to the component. Import the FormControl class from @angular/forms and add the following property declaration to your header component.

import { FormControl } from '@angular/forms';
import { PhotosService ...