Angular2で約束を繋ぐときの問題

Question

私は約束の概念を完全に理解するために何かを忘れています。

私はこれを達成しよう：

onSubmit(event: any) { 
     this.submitted = true; 
     event.preventDefault(); 

     this.si 
     .signIn(this.emailAddress, this.password, this.keepSignedIn) 
     .toPromise() 
     .next((res:any) => { 
      this.router.navigate(['dashboard']); 
     }); 
} 

を次のように、私のhttp戻ったら関数を呼び出すが、エラーました：次のように私は私の電話を書いたサービスで

this.si 
.signIn(this.emailAddress, this.password, this.keepSignedIn) 
.toPromise is not a function.': 

を。あなたのサービスで

signIn(emailAddress: string, password: string, keepSignedIn: boolean): Promise<any> { 
    console.log("SigninService, emailaddress="+emailAddress); 
    console.log("SigninService, password="+password); 

    const auth = this.buildAuthToken(emailAddress, password, keepSignedIn); 
    const headers = this.getHeaders(); 

    console.log("SigninService, headers="+JSON.stringify(headers)); 

    const url = 'http://dev-user.zeens.ws/api/v1/me'; 
    return this.http.get(url, {headers: headers}) 
    .toPromise() 
    .then(response => { 
     console.log("response="+JSON.stringify(response.json())); 
     this.user = response.json().result; 

     console.log("response="+JSON.stringify(this.user)); 

     localStorage.setItem('user', JSON.stringify(this.user)); 

     return this.user; 
     /* 
     console.log("signin="+JSON.stringify(response.json().data)); 
     return response.json().data; 
     */ 
    }) 
    .catch(this.handleError); 
} 

Answer 1

return this.http.get(url, {headers: headers}) 
.toPromise() 
.then(response => { 
    ... 
}) 
.catch(this.handleError); 

、あなたはすでにtoPromiseを使用しています。あなたが次に

signIn(emailAddress: string, password: string, keepSignedIn: boolean): Promise<any> 

：あなたはそれを書いたように 、あなたの関数は、次の定義が含まれここ

this.si 
    .signIn(this.emailAddress, this.password, this.keepSignedIn) 
    .toPromise() // <---- PROBLEM 
    .next((res:any) => { 
     this.router.navigate(['dashboard']); 
    }); 

あなたが約束を、toPromiseを適用しようとします。

なぜあなたはそれを約束に変えたいのですか？

あなたは、単に行うことができます：

signIn(emailAddress: string, password: string, keepSignedIn: boolean): Observable<any> { 
    ... 

    return this.http.get(url, {headers: headers}) 
    .map((response: Response) => { 
     this.user = response.json().result; 

     localStorage.setItem('user', this.user); 

     return this.user; 
    }) 
    .catch(this.handleError); 
} 

onSubmit(event: any) { 
    this.submitted = true; 

    this.si 
     .signIn(this.emailAddress, this.password, this.keepSignedIn) 
     .subscribe((res:any) => { 
      this.router.navigate(['dashboard']); 
     }); 

    // returning false is equivalent to event.preventDefault() 
    return false; 
} 

EDIT：
をマップが定義されているために、あなたはそれをインポートする必要があります。
あなたmain.tsで またはどこかに一度だけロードされ、次の行を追加します。

import 'rxjs/add/operator/map'; 

ただ、例えば、ここに私の輸入です：

// rxjs operators 
// see node_module/rxjs/Rxjs.js 
// statics 
import 'rxjs/add/observable/throw'; 
// operators 
import 'rxjs/add/operator/catch'; 
import 'rxjs/add/operator/delay'; 
import 'rxjs/add/operator/debounceTime'; 
import 'rxjs/add/operator/distinctUntilChanged'; 
import 'rxjs/add/operator/map'; 
import 'rxjs/add/operator/let'; 
import 'rxjs/add/operator/switchMap'; 
import 'rxjs/add/operator/toPromise'; 
import 'rxjs/add/operator/withLatestFrom'; 
import 'rxjs/add/operator/combineLatest'; 

// observables 
import 'rxjs/add/observable/empty';