Angular2を使って投稿リクエストの返信に応じてレンダリングする方法

Question

現在、私はユーザーがメールIDとパスワードを入力してサーバーコールを行うときにログインするためのポップアップを持っています。受け取った応答に応じてどのように対応するか。これは呼ばれていたことを行う上で

submitHandler: function(form) { 
     $('.signin_form').attr('disabled','disabled') 

     var data = {} 
     $(form).serializeArray().map(function(x){data[x.name] = x.value;}); 
     helperMethods.ajaxHandler(accounts_url+'login_user/','POST', 
     data,authHelpers.afterLogin) 
    } 

：以前の私は、私は次のようにそれをやったJavaScriptを使用していたとき

var authHelpers = {  
    afterLogin : function(response){ 
    $('.signin_form').removeAttr('disabled') 

    if(response.message!=undefined){ 
     if(typeof response.message.validation!='undefined' 
     && response.message.validation.indexOf('verifi')!='-1'){ 
      $('.error_display').html('<div>Error</div>') 

     }else{ 
      $('.error_display').text(response.message.validation) 

     } 
     $('input[name="password"]').val('') 
     return; 
    } 
    if(response.token!=''){ 
     localStorage.setItem('jwt_token',response.token) 
     window.location.reload() 
    } 

} 
} 

どのように私はそれを用いangular2と活字体を実装することができますか？

ありがとうございます。

Answer 1

レスポンスを具体化するには、Angular2 httpクライアントを使用してPOSTリクエストを発行し、Observablesubscribeメソッドを使用する必要があります。

ここでここでPOSTコマンド

import {Injectable} from 'angular2/core'; 
import {Http, Headers, RequestOptions, Response} from 'angular2/http'; 
import {Environment} from '../settings/environment.service'; 
import {BackEndService} from '../app/backEnd.service'; 

@Injectable() 
export class BackEndRestService extends BackEndService { 

    constructor(private _http: Http, private _environment: Environment) { 
     super(); 
    } 

    authorize(inAccessCode: string) { 
     let myUrl = this._environment.baseRestServicesUrl + 'authorize'; 
     let options = this.getOpionsForPost(); 
     let jsonString = JSON.stringify({_accessCode: inAccessCode}); 
     return this._http.post(myUrl, jsonString, options) 
           .catch(this.handleError) 
    } 

private handleError (error: Response) { 
    return Observable.throw(errorText || 'Server error'); 
} 

    private getOpionsForPost() { 
     let headers = new Headers(); 
     headers.append('Content-Type', 'application/json'); 
     return new RequestOptions({headers: headers}); 
    } 
} 

を発行するサービスクラスの例は、私は、サーバーを呼び出すことができる午前、これは