Angular has many modules for you to use in your application. It's up to you as the developer to decide what you need. In this video we'll look at the different modules provided by Angular, then we'll install one for use in our application.
[MUSIC] 0:00 So far, we've bootstrapped our application and created a few different components. 0:04 In this stage, we'll be configuring a service to send and 0:09 retrieve data with a back end server. 0:12 But before we begin, let's take a quick look at some different modules provided by 0:16 Angular and the Angular community. 0:20 Today, there isn't any quick and easy way to find the modules available for 0:23 you to use in your Angular application. 0:27 The best way to find modules provided by Angular is by reading 0:30 through the documentation's API reference and filtering on the word module. 0:34 Third party modules or modules created by the community are harder to find, 0:40 due to the both angular one and angular having very similar names. 0:44 You can however navigate to tools and libraries at the bottom of the page for 0:48 helpful links. 0:53 I've added some of these links to the teacher's notes. 0:55 Our application is very simple and doesn't require many modules. 0:58 In fact, we'll be only installing two modules in this course. 1:02 We need to wait to load the photo entries from the server. 1:07 To retrieve data from the server, the client sends a GET request and 1:10 the server responds with the data requested. 1:14 When the client wants to save data to the database, 1:17 it sends the data in a POST request to the server. 1:20 The GET and POST request methods are part of the HttpModule in Angular. 1:24 The HTTP module is provided by Angular but 1:30 it's separate from the core Angular library. 1:32 We'll need to use our terminal to install the http module from NPM. 1:35 In the roots of our project, 1:40 type in NPM install the @angular/http--save. 1:45 Remember the beginning @ indicates the package we're installing 1:53 is part of angular's name space in npm. 1:58 Because we need to ensure we're installing the correct version for 2:01 this course we'll also append an @ and then the version number. 2:04 2.4.2 we'll also include the save exact flag. 2:08 Installing a later version of the HTTP module 2:16 may not work unless you update all of Angular packages. 2:19 You can find more detailed explanation in the teacher's notes. 2:23 Once the package is installed you can close the terminal. 2:27 Then, you can go over to the vendor's ts file. 2:32 Add a new line below all the other at angular module 2:38 imports and import @angular/http. 2:45 Next, we need to register the http module with our application. 2:51 Open up the app.module.ts file, 2:55 And add a new line after the browser module import. 3:03 And import The HttpModule from the angular/http package. 3:07 Then, in the imports array of our NgModule. 3:27 We'll add the HTTP module we just imported. 3:30 By adding the HTTP module to our app module, 3:34 we can now start using the HTTP module throughout our application. 3:38 Well done, in the next video, we'll learn about dependency injection and 3:43 how to use it in an Angular application. 3:47
You need to sign up for Treehouse in order to download course files.Sign up