Coding Challenge: Implement a Filter

Test yourself by implementing a filter using stream transformation.

We'll cover the following

Problem statement

You’ve been given an existing Angular web application that retrieves recipe data from a back-end API. The data is present in recipes.json file in Chapter06/recipes-book-api/db-json folder. The front-end Angular application is implemented inside the recipes-book-front folder. Your task is to enhance this application by implementing a filtering feature. The filtering functionality should allow users to search for recipes based on three criteria: recipe name, chef’s name, and taste.

You can follow the steps below to implement the feature in the application:

  • Implement the filtering function in the src/app/recipes-list/recipes-list.component.ts file.

  • Initialize the recipe form in the src/app/recipes-filter/recipes-filter.component.ts file.

  • Implement the model of recipe class in the src/app/core/model/recipe.model.ts file.

Try it yourself

Get hands-on with 1200+ tech skills courses.