import { Component , OnInit } from '@angular/core' ; import { FormGroup , FormBuilder , Validators , FormControl , } from '@angular/forms' ; import { FlashMessagesService } from 'angular2-flash-messages' ; 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 implements OnInit { registerForm : FormGroup ; constructor ( public formBuilder , public flashMessagesService , public authService , public router ) { } ngOnInit ( ) { this . checkLoggedIn ( ) ; this . registerForm = this . formBuilder . group ( { username : [ '' , [ Validators . required , Validators . minLength ( 4 ) , Validators . maxLength ( 14 ) , ] , ] , password : [ '' , [ Validators . required , Validators . minLength ( 4 ) ] ] , confirmPass : [ '' , [ Validators . required , Validators . minLength ( 4 ) ] ] , } ) ; } checkLoggedIn ( ) { if ( this . authService . loggedIn ( ) ) { this . router . navigate ( [ '/' ] ) ; } } onRegisterSubmit ( ) { this . authService . registerUser ( this . registerForm . value ) . subscribe ( data => { if ( data . success == true ) { this . flashMessagesService . show ( data . msg , { cssClass : 'alert-success' , timeout : 3000 , } ) ; this . router . navigate ( [ '/login' ] ) ; } else { this . flashMessagesService . show ( data . msg , { cssClass : 'alert-danger' , timeout : 3000 , } ) ; } } ) ; } }