form / component /service

angular.ts

FORM

<form class="ui form" [formGroup]="login" (ngSubmit)="onSubmit(login.value)" novalidate>
  <div class="field">
    <label>E-mail</label>
    <input type="text" placeholder="Seu e-mail ou usuário" name="email" formControlName="email" required>
  </div>
  <div class="field">
    <label>Senha</label>
    <input type="password" placeholder="Informe sua senha" name="password" formControlName="password" required>
  </div>
  <div class="field">
    <div class="ui checkbox" appCheckbox>
      <input type="checkbox" tabindex="0" class="hidden" name="remember_me" formControlName="remember_me">
      <label>Mantenha-me conectado</label>
    </div>
  </div>
  <button class="ui secondary large button fluid" type="submit" [disabled]="submitted || !login.valid" [ngClass]="{'loading': submitted}">Log in</button>
  <p class="ui center aligned header">
    <a [routerLink]="['/forgot']">Esqueceu a senha?</a>
  </p>
</form>

COMPONENT
      
onSubmit(user) {
  this.submitted = true;
  this.loginService.createSession(user).subscribe(
    data => {
      data['status'] ? this.onSuccess(data) : this.toasty.addToast('error', data['message']);

    },
    error => { console.log(error); },

    () => this.submitted = false
  );
}

SERVICE

createSession(user: object): Observable<any> {
  const headers = new Headers({ 'Content-Type': 'application/json' });
  const options = new RequestOptions({ headers: headers });

  return this.http.post(this.url, JSON.stringify(user), options)
                  .map((response: Response) => response.json())
                  .catch((error: any) => Observable.throw(error));
}