how to consume API in angular

lets first make a fresh new project in angular framework with the following command:-

ng new ‘your project name’

now let's open the project in your IDE

now we’re using this free API https://jsonplaceholder.typicode.com/users

let's make a new service to consume the data of this API with the following command:-

ng g s ‘your service name’

then make a function in it:-

then inject it in the angular component with the help constructor in the .ts file

constructor(public apiservice: ApiService){}

and make a variable that will store all the data from it.

data;

then make a new function to use the above service’s function

and now call this function in ngOnInit(one of the most used lifecycle hooks)

and now its time to use this data variable in the view part i.e, app.component.html with the help of data binding

<pre>{{data | JSON }}</pre>

here is the output:-