Skip to main content
Angular 4

Angular 4 CRUD application with Spring Boot REST service – Part 3

Angular 4

This is the last part of Angular 4 and Spring Boot application build tutorial series.

Part 1 – Spring Boot REST service and setup Angular app

Part 2 – Integrate with the REST service

Today, we’re going to create, update and delete functionalities.

1) Create User

First thing is, implement the user service for saving a new user.

user.service.ts

Next thing is, import these modules into the users.module.ts.

Then add these html into the user-create.component.ts.

Finally, changes the user-create.component.ts as following.

 

2) Update User

For updating, we are going to use the same form which used for creating a new user. For updating the user, we need to 2 api calls. First one is getUserById() and updateUser(). These are already implemented in the REST service.

Modify the user.service.ts.

Changed the user-create.component.ts.

3) Delete User

Once again, modified the user.service.ts.

And implement the deleteUser() in user-list.component.ts.

4) Run it

Now, run it using ng serve command

user-list view

user-create view

Clone it : – GitHub


Related Post

34683total visits,5visits today

RSS
Follow by Email
Facebook
Facebook
Google+
http://mydevgeek.com/angular-4-crud-application-with-spring-boot-rest-service-part-3
Twitter