jara-register.js

import { Component, OnInit } from '@angular/core';
import { Router } from '@angular/router';
import { Response } from '@angular/http';

import * as localForage from "localforage"

import { HttpService } from '../../http.service';

@Component({
  selector: 'app-register',
  templateUrl: './register.component.html',
  styleUrls: ['./register.component.css']
})
export class RegisterComponent implements OnInit {

  regInfo: Object = {}
  token: string = ''

  constructor(private httpService: HttpService, private router: Router) { }

  ngOnInit() {
  }

  public onSubmit(evt) {
    evt.preventDefault()
    if (this.regInfo['password'] !== this.regInfo['retype_password']) {
      alert("Password dosen't match")
      return
    }
    delete this.regInfo['retype_password']
    this.httpService.register(this.token, this.regInfo).subscribe(data => {
      console.log(data)
      alert("Registration successful !!!\nNow login to access your account")
      this.router.navigate(['/login']);
    }, error => {
      const response: Response = error
      if (response.status == 400) {
        let message: string = '', errorObject: Object = response.json()['error']['invalidAttributes']
        const invalidAttributesKeys = Object.keys(errorObject)
        invalidAttributesKeys.forEach(key => message += `${key} is invalid \n`)
        if(errorObject.hasOwnProperty('email')){
          message += `Email address cannot be repeated`
        }
        if(errorObject.hasOwnProperty('accountNo')){
          message += `Account no must be 10 digits`
        }
        alert(message)
      } else {
        alert("Error connecting to the server")
      }
    })
  }

}