On the last step of the multistep form, users should be able to review and then save the form data. As a good practice, a successful POST request will return the data that was saved back to the browser. We can then reload the form with the information received back from the server:
src/app/user/profile/profile.component ...async save(form: FormGroup) { this.userService .updateUser(form.value) .subscribe(res => this.buildUserForm(res), err => (this.userError = err)) }...
If there are errors, they'll be set to userError to be displayed. Before saving, we will present the data in a compact form in a reusable component that we can bind the form data to:
src/app/user/profile/profile.component.html...<mat-step [stepControl]="userForm"> ...