Using debounce with Reactive form control

If you're building a medium-to large-scale Angular app with Reactive forms, you'll surely encounter a scenario where you might want to use a debounce on a Reactive form. It could be for performance reasons, or for saving HTTP calls. So, in this recipe, you're going to learn how to use debounce on a Reactive form control.

Getting ready

The project that we are going to work with resides in chapter08/start_here/using-debounce-with-rfc inside the cloned repository:

1. Open the project in Visual Studio Code.
2. Open the terminal and run npm install to install the dependencies of the project.
3. Once done, run ng serve -o.

   This should open the app in a new browser tab and you should see it as follows:

Figure 8.23 – The Using debounce with Reactive Form Control app running on http://localhost:4200

Right now, you'll notice that for each character we type into the input, we send...