1 import { Component, OnInit } from '@angular/core'
2 import { FormBuilder, FormGroup, Validators } from '@angular/forms'
3 import { Router } from '@angular/router'
5 import { AuthService } from '../core'
6 import { FormReactive } from '../shared'
10 templateUrl: './login.component.html',
11 styleUrls: [ './login.component.scss' ]
14 export class LoginComponent extends FormReactive implements OnInit {
22 validationMessages = {
24 'required': 'Username is required.'
27 'required': 'Password is required.'
32 private authService: AuthService,
33 private formBuilder: FormBuilder,
34 private router: Router
40 this.form = this.formBuilder.group({
41 username: [ '', Validators.required ],
42 password: [ '', Validators.required ]
45 this.form.valueChanges.subscribe(data => this.onValueChanged(data))
55 const { username, password } = this.form.value
57 this.authService.login(username, password).subscribe(
58 result => this.router.navigate(['/videos/list']),
61 if (err.message === 'invalid_grant') {
62 this.error = 'Credentials are invalid.'
64 this.error = `${err.body.error_description}`