Angular2：変数をオブザーバブルから別の関数に渡す方法

Question

以下のコードは明らかに機能しません。 rxjs observable関数から取り出された変数を別の関数に渡そうとしています。しかし、私はそれをどうやって行うのか分かりませんし、適切な例は見つけられません。

そこで、例えば以下のコードは、getUserName()正常JSONからthis.usernameを取り出します。しかし、私はgetUserInfo（）関数にこれを渡す方法については考えていません。

私はいつも定義されていません。

import {Component, OnInit, Injectable} from '@angular/core'; 
import {Http, Response} from '@angular/http'; 
import {Observable} from 'rxjs/Rx'; 
import 'rxjs/add/operator/map'; 
import {Post} from './Post'; 

@Injectable() 
export class UserService { 

    username: any; 

    constructor(private http: Http) {} 


getUserName(){ 
this.http.get("http://localhost:1337/user").map(res => res.json()).subscribe(
      data => this.username = data.username, 
      err => console.log(err)) 
} 

getUserInfo(){ 
    console.log(this.username); 
} 






} 


} 

Answer 1

これは、あなたの質問に答えていない直接のかもしれないが、多分それは私はあなたがどこかのコンポーネントでユーザーデータを使用することを想定し、最も可能性の高いテンプレートてる 、非レスに役立ちます - その場合には、それがフェッチされたデータを保存し、アクセスするためにBehaviorSubjectを使用することは通常有用である、あなたはこのようにそれを行うことができます：

@Injectable() 
export class UserService { 
    userData$ = new BehaviorSubject<IUserData>(); 

    constructor(private http: Http) { 
     this.userData$ 
      .subscribe(data => doSomeStuffWheneverUserDataUpdates(data)); 
    } 

    fetchUserData(){ 
     this.http.get("http://localhost:1337/user") 
      .map(res => res.json()) 
      .subscribe(
       data => this.userData$.next(data), 
       err => console.log(err) 
      ); 
    } 
} 

...とどこかのコンポーネントで使用することができます：

class MyComponent { 
    constructor(private userService: UserService) { 
     userService.fetchUserData(); 

     // optionally you could subscribe here to 
     // userService.userData$ to do some action whenever 
     // the userData updates, just don't forget to 
     // unsubscribe when the component is destroyed 
    } 
} 

...テンプレート内：

<div>UserName: {{(userService.userData$ | async)?.username}}</div>