From the course: Angular: API Communication and Authentication
Join today to access over 24,800 courses taught by industry experts.
Writing the onSubmit() function - Angular Tutorial
From the course: Angular: API Communication and Authentication
Writing the onSubmit() function
- [Instructor] Now let's start with the onSubmit function. As specified in the template, this function will take in an NgForm object. First, we set the loading flag to true. Then we make a copy of the form values using Object.assign. We can now construct the new contact that would be added. I'm using type information here, so type script is telling me what property is missing from this object. The name will consist of both the firstName and the lastName values. We add in the address, the phone, which will consist of three formValues, and lastly, the photoURL. Since we will be sending json data to our server, we need to specify that information in our request. Create a new Headers object. And we append the Content-Type header, which will hold a value application/json. Using the headers, construct a RequestOptions object. To post a new contact to our API, make a post call on the http object. The first argument will be the URL, which is api/contacts, followed by the payload, which is our…
Practice while you learn with exercise files
Download the files the instructor uses to teach the course. Follow along and learn by watching, listening and practicing.
Download courses and learn on the go
Watch courses on your mobile device without an internet connection. Download courses using your iOS or Android LinkedIn Learning app.
Contents
-
-
-
-
GET route for the API4m 55s
-
(Locked)
POST route for the API3m 54s
-
(Locked)
Using @angular/http to retrieve contacts, part 13m 8s
-
(Locked)
Using @angular/http to retrieve contacts, part 23m 52s
-
(Locked)
Creating a new route for adding a new contact6m 12s
-
(Locked)
Using ngForm for form submission2m 49s
-
(Locked)
Writing the onSubmit() function4m 16s
-
-
-
-
-