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
Get step-by-step solutions from verified subject matter experts
