2017-05-23 4 views
2

これはredirect to a route after api call in angular2と似ていますが、リダイレクトの一部としてクラス変数(this.areaCode)を使用して変数(this.userInfoMessage)を更新したいとします。例:api呼び出し後の経路にリダイレクトする(「this」を使用)

onSubmit(form: string): void { 
    this.taskService.createTask(task).subscribe(this.taskCreated,this.handleError) 
} 
private taskCreated (resp: any) { 
    console.log("Task created successfully",resp) 
    this.router.navigate([`/areas/${this.areaCode}`]); // eg: "/areas/12" //"this" is of type SafeSubscriber, not my class 
} 
private handleError (error: any) { 
    this.userInfoMessage="We've got errors here!" //"this" is of type SafeSubscriber, not my class so the message is now bound 
    console.log(error) 
} 

ただし、これらの関数のクラスへの参照を取得する方法はわかりません。 self=thisのトリックを使用する必要がありますか?もしそうなら、どうですか?

おかげ

UPDATE

私は質問は、私は、サブスクリプションへの参照を渡すんか」と思いthis

this.taskService.createTask(task).subscribe(this.taskCreated,this.handleError).bind(this)にしかし Property 'bind' does not exist on type 'Subscription'. UPDATE(2)

を渡して試してみました折り返し電話?"

私はそれがコンパイルされません

var self= this 
this.taskService.createTask(task).subscribe(this.taskCreated(self),this.handleError) 

を使用してみましたが、現在のオブジェクトへの参照を渡してサブスクライブしたい場合はリンクQを読みました。 私はまだコールバックが プライベートtaskCreated(RESP:任意の)として定義されている

私はこれは私が何をしないのですリンクQ.

と全く同じだと思いませんか?

おかげ

+0

[コールバック内の正しい\ 'this \]コンテキストにアクセスする方法は?](https://stackoverflow.com/questions/20279484/how-to-access-the-correct-this-context-コールバック内) – estus

+0

誰もが投票を終える前に、私が他の回答からうまくいくかどうかを聞かせてもらえますか、まさに私はpleasEをする必要がありますか? – Badgerspot

答えて

2

あなたは機能そのものをbindする必要があるだろうが、ない方法をサブスクライブします。

onSubmit(form: string): void { 
    this.taskService.createTask(task).subscribe(this.taskCreated.bind(this),this.handleError.bind(this)) 
} 

それが閉鎖になり行う別の方法:と方法自体をインスタンス化するだろう活字体でこれを達成するために

this.taskService.createTask(task) 
     .subscribe(
      (res) => this.taskCreated(res), 
      (err) => this.handleError 
     ) 
    } 

niftier、クリーナー、そしてあまり知ら方法脂肪矢印、常にクラス自体を指し字句thisにつながる:

onSubmit(form: string): void { 
    this.taskService.createTask(task).subscribe(this.taskCreated,this.handleError) 
} 

private taskCreated = (resp: any) => { 
    console.log("Task created successfully",resp) 
    this.router.navigate([`/areas/${this.areaCode}`]); // 'this' will refer to class! 
} 

private handleError = (error: any) => { 
    this.userInfoMessage="We've got errors here!" // 'this' will also refer to the class! 
    console.log(error) 
} 

公式種類criptドキュメントは可能なときに関数のバインドを助言するので、私は2番目の2つのソリューションのいずれかを使用します。

+0

3番目のソリューションは完全に機能しました。ありがとう – Badgerspot

1

あなたはこれを試すことができます。

private handleError = (error) => { 
    this.userInfo = "we have a problem here"; 
} 
関連する問題