### File

`src/app/Views/register/register.component.ts`

### Metadata

selector | `app-register`
styleUrls | `register.component.scss`
templateUrl | `register.component.html`

### Constructor

`constructor(authService: AuthService, router: Router)`
Parameters : privateauthService : `AuthService` privaterouter : `Router`

### Methods

onSubmit
`onSubmit()`
On submit, send user information to backend Returns: `void`

### Properties

checkPasswordFailed
`checkPasswordFailed: `boolean``
Default value: `false`

errorMessage
`errorMessage: `string``

form
`form: `any``

isSignUpFailed
`isSignUpFailed: `boolean``
Default value: `false`

isSuccessful
`isSuccessful: `boolean``
Default value: `false`

    import { Component, OnInit } from '@angular/core';
    import { Router } from '@angular/router';
    import { AuthService } from '../../Services/auth.service';

    @Component({
      selector: 'app-register',
      templateUrl: './register.component.html',
      styleUrls: ['./register.component.scss'],
    })
    export class RegisterComponent {
      form: any = {
        email: null,
        password: null,
        passwordRepeat: null,
        username: null,
      };
      isSuccessful = false;
      isSignUpFailed = false;
      errorMessage = '';

      checkPasswordFailed = false;

      /**
       * @param  {AuthService} privateauthService
       * @param  {Router} privaterouter
       */
      constructor(private authService: AuthService, private router: Router) {}

      /**
       * On submit, send user information to backend
       */
      onSubmit(): void {
        // validate that passwords match
        if (this.form.password === this.form.passwordRepeat) {
          this.checkPasswordFailed = false;
          const { email, username, password } = this.form;
          this.authService.register(email, username, password).subscribe(
            (data) => {
              this.isSuccessful = true;
              this.isSignUpFailed = false;
              this.router.navigate(['/login']);
            },
            (err) => {
              this.errorMessage = err.error.message;
              this.isSignUpFailed = true;
            }
          );
        } else {
          this.checkPasswordFailed = true;
        }
      }
    }

# results matching ""

# No results matching ""