Angularjs 서비스가 Observables with Multicomponent View로 구현되었습니다.

Question

현재 Angular는 Observables를 다양한 구성 요소에서 사용할 서비스에서 구현하는 데 문제가 있습니다. 기본적으로 구성 요소 C 및 구성 요소 B 내부에 구성 요소 A 및 구성 요소 B가 있다는 문제가 있습니다. 구성 요소 A는 바퀴를 말하며, 구성 요소 B는 드롭 다운을 사용하여 구성 요소 A의 바퀴를 선택하는 개체를 만드는 개체입니다. 내 문제는 바퀴를 만들 때 새로 페이지를 새로 고쳐야한다는 것입니다. Observables를 구현하려고 노력하는 이유는 컴포넌트 B의 드롭 다운에 나타나는 휠을 생성했지만 지금까지는 성공하지 못했습니다.

서비스 :

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에 삽입 된 경우에도 아무 것도 발생하면 관찰 할 수있는 함수를 다음에 함수.

어떤 도움을 주셔서 감사합니다. 미리 감사드립니다. 당신이 추가 된 항목은 당신이이

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

Answer 1

시도 할 수 있습니다 추가됩니다 후 바로 표시하려면

Answer 2

어떻게 그것을 구현 끝났다 :

서비스 :

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();