Question: Create an employee service to fetch data from an external API. Create a new component (newemployee) to display this data. Also, use dependency injection to

Create an employee service to fetch data from an external API. Create a new component (newemployee) to display this data. Also, use dependency injection to inject the service into newly created component.

Follow the steps below to build the application:

1. Create a new component and name it newemployee

2. Create a new interface (employee2.ts file) for this component with the below mentioned fields

a. id

b. employee_name

c. employee_salary

d. employee_age

e. profile_image

Make sure you use same properties available in API response.

3. Create a service to access data from API

4. In the template of the newly created component add the code to display a table with the below mentioned fields:

a. Employee_Id

b. Name

c. Salary

d. Age

5. Import employee2.ts interface into newcomponent.ts file

6. Inject the service into newcomponent.ts file via a constructor

Use service and component created in previous assignment to fetch data from public API using HttpClient.

Use observables and subscribe data in component We will use below API to fetch data:

API URL - http://dummy.restapiexample.com/api/v1/employees

Follow the steps below to build the application:

1. In the service created add the API URL

2. Add HttpClientModule to app.module.ts

3. Inject HttpClient library into the newly created service and create an instance of this via a constructor

4. Create a method to get data from API. Also Import observable and use it as return type in method

5. Call this service method from newemployee.component.ts file and subscribe to it

6. Bind data received from the service to newemployee.component.html using *ngFor

7. Make use of Bootstrap to design the application

I have to work this on Angular and and in Visual Studio Code

Step by Step Solution

There are 3 Steps involved in it

1 Expert Approved Answer
Step: 1 Unlock blur-text-image
Question Has Been Solved by an Expert!

Get step-by-step solutions from verified subject matter experts

Step: 2 Unlock
Step: 3 Unlock

Students Have Also Explored These Related Databases Questions!