Join Gary Simon for an in-depth discussion in this video Creating the data service, part of Angular 2+: Creating CRUD Apps.
- [Instructor] Now that our back end and API's all set up, we're going to focus on building out our app primarily within Angular, though we will periodically visit our API file to create more endpoints based on our needs. In this video, we're going to use the Angular command line interface tool to generate a service which will allow our Angular components to communicate with the API. So to do so in the console, we'll type ng, g for generate, service, and the name of the service, we'll make it article.
Now, in the source app, we'll see we have article service TS file, and we need to import several members from the Angular HTTP library. We'll import Http, Headers, and RequestOptions from angular/http. Headers and RequestOptions will be used when we create methods that will submit post requests when inserting articles and updating articles.
Next we need to import the RXJS map operator, which will be used on all of our API calls. Now, in the component class, we're going to create a property called result of type any, and this will handle the response from our API. Okay, next we need to create an instance of HTTP through dependency injection. So in the constructor, we'll put in private http to http.
And now let's create our very first method which will communicate with the all API endpoint that we created earlier. Now remember, this will return all of the documents within the article's collection. So underneath the constructor, we'll create a method called getArticles, and we're going to return our get request from /api/all, and we use our map operator to take this result to result.json format.
All right, so we're going to be adding more methods that will communicate with different API endpoints as we develop this app. For now, though, we're going to stop here, and in the next video, we'll generate our component files and use this getArticles method to display the results.
- Angular Firebase CRUD
- Firebase setup
- Starting a project
- Defining the template
- CRUD apps with MongoDB
- MongoDB setup
- Creating a data service
- Home component
- Creating, updating, and deleting articles