AngularjsサービスはObservables with Multicomponent Viewで実装されました

Question

現在AngularはObservablesを様々なコンポーネントで使用されるサービスで実装するのに問題があります。私は基本的にコンポーネントCとタブスタイルの中にコンポーネントAとコンポーネントBを持っているという問題があります。コンポーネントAはホイールを言うとオブジェクトを作成し、コンポーネントBはドロップダウンを使用してコンポーネントAからどのホイールを選択するかを作成するためのものです。私の問題は、ホイールを作成するときに、私はObservablesを実装しようとしていますが、これまでのところ成功していませんでした。

サービス：

constructor(private http: Http) { 
    this._departamentos = <BehaviorSubject<Departamento[]>>new BehaviorSubject([]); 
    this.departamentos = this._departamentos.asObservable(); 
    } 

    private url: string = 'http://localhost:8080/'; 
    departamentos: Observable<Departamento[]>; 
    private _departamentos: BehaviorSubject<any[]>; 

    // <------------------------ GET ------------------------> 
    getDepartments(): Observable<Departamento[]>{ 
     this.departamentos = this.http.get(this.url+'selectdepartamentos') 
      .map(this.extractData) 
      .catch(this.handleError); 
    return this.departamentos; 
    } 

    private extractData(response: Response) { 
     let body = response.json(); 
     return body || {}; 
    } 

    private handleError(error: Response) { 
     console.log(error); 
     return Observable.throw(error.json().error || "500 internal server error"); 
    } 

    // <------------------------ ADD ------------------------> 
    addDepartment(newDepartment){ 
    return this.http.post(this.url + 'departamento', newDepartment).map(
     response => this._departamentos.next(Object.assign({}, newDepartment))); 
    } 

    // <------------------------ UPDATE ------------------------> 
    updateDepartment(nameOldDepartment, newDepartment){ 
     return this.http.put(this.url+'update/'+nameOldDepartment+'/departamento', newDepartment); 
    } 

    // <------------------------ DELETE ------------------------> 
    deleteDepartment(nameOldDepartment){ 
     return this.http.delete(this.url+'delete/'+nameOldDepartment); 
    } 

コンポーネントで購読：

this.departamentoService.getDepartments() 
    .subscribe(departments => this.arregloDepartamentos = departments, 
       error => this.errorMessage = <any>error); 

私はページを更新するとき、私が最初に私は上の持っているにもかかわらず、私のコンポーネントBから値を得ることができることを言及する価値

オブジェクトにDBが挿入されていても何も起こらない場合、Observableの次の関数を（サービス内の）Addメソッドに追加します。

ご協力いただきありがとうございます。

Answer 1

を試すことができます。これは、私はそれを実装終了する方法です：

サービス：

private departmentsSubject = new BehaviorSubject([]); 
private departments: Departamento[]; 

// <------------------------ GET ------------------------> 
getDepartments(): Observable<Departamento[]>{ 
    return this.departmentsSubject.asObservable(); 
} 
private extractData(response: Response) { 
    let body = response.json(); 
    return body || {}; 
} 
private handleError(error: Response) { 
    console.log(error); 
    return Observable.throw(error.json().error || "500 internal server error"); 
} 
loadDepartments(){ 
    var sub = this.http.get(this.url+'selectdepartamentos') 
     .map(this.extractData) 
     .catch(this.handleError); 
    sub.subscribe(
    data => this.departments = data, 
    err => console.log(err), 
    () => this.refresh() 
); 
} 
private refresh() { 
    this.departmentsSubject.next(this.departments); 
} 

Component.ts ：

this.departamentoService.getDepartments().subscribe(
    departments => this.arregloDepartamentosDelete = departments 
); 
this.departamentoService.loadDepartments(); 

Answer 2

追加した項目を表示したい場合には、追加の右後にあなたが

this.departamentoService.addDepartment(newDept).switchMap(()=>this.getDepartments()) 
.subscribe(departments => this.arregloDepartamentos = departments, 
      error => this.errorMessage = <any>error);