Dynamic configurations using value providers

In this recipe, you’ll learn how to use value providers in Angular to provide constants and config values to your app. We’ll start with the same example from the previous recipe, which involves EmployeeComponent and AdminComponent using the BucketComponent to manage a bucket of fruits. We will restrict the EmployeeComponent from deleting items from the bucket by using the configuration with a value provider. As a result, the employees won’t even see the Delete button.

Getting ready

The app that we are going to work with resides in start/apps/chapter03/ng-value-providers inside the cloned repository:

1. Open the code repository in your code editor.
2. Open the terminal, navigate to the code repository directory, and run the following command to serve the project:

   npm run serve ng-value-providers
   

   This should open the app in a new browser tab, and you should see the app as shown in...