login.ts

import {Component, Injectable} from 'angular2/core';
import {FormBuilder, Validators, FORM_DIRECTIVES} from 'angular2/common';
import {Router} from 'angular2/router';
import {Http, Headers} from 'angular2/http';

@Component({
  selector: 'login',
  templateUrl: './components/login/login.html',
  styleUrls: ['./components/login/login.css'],
  directives: [FORM_DIRECTIVES],
  providers: [FormBuilder]
})

@Injectable()
export class LoginCmp {
  form;
  apiUrl;

  constructor(
    fb: FormBuilder,
    private _http: Http,
    private _router: Router
  ) {
    this.form = fb.group({
      identifier: ['', Validators.required],
      password: ['', Validators.required]
    });

    this.apiUrl = '<%= BACKEND_URL %>';
  }

  onSubmit() {
    var _this = this;

    let headers = new Headers();

    headers.append('Content-Type', 'application/json');

    this._http
      .post(
        this.apiUrl + '/login',
        JSON.stringify(this.form.value),
        {headers: headers}
      )
      .subscribe(onSuccess, onError);

    function onSuccess(response) {
      let data = response.json();

      localStorage.setItem('id_token', data.token);
      localStorage.setItem('user', JSON.stringify(data.user));

      _this._router.navigate(['/Examples/Book']);
    }

    function onError(error) {
      console.log('error');
      console.log(error);
    }
  }
}