2017-03-24 3 views
0

제목 서비스가 있습니다.탭 2 변경 후 다시 방문하여 각도 2로 구독하십시오.

private subject = new Subject<any>(); 

sendMessage(message: any) { 
    this.subject.next(message); 
} 

clearMessage() { 
    this.subject.next(); 
} 

getMessage(): Observable<any> { 
    return this.subject.asObservable(); 
} 

그리고 부모 구성 요소에서 메시지를 먹이

참고 : 내 부모 - 자식 구성 요소는 다음 router-outlet

private getMerchantDetail() { 
let data = { 
    Id: this.merchantId, 
} 
this.merchantsService.getMerchants(data) 
    .then((res) => { 
    // console.log(res) 
    if (res.Success) { 
     this.merchant = res.Data[0]; 
     this.merchantListDetailService.sendMessage(res.Data[0]); -> here 
    } 
    }) 
    .catch((err) => { }) 
} 

그리고 모든 하위 구성 요소의 데이터를 가입을 통해 연결;

ngOnInit() { 
    this.merchantSubscribe = this.merchantListDetailService.getMessage() 
     .subscribe(merchant => { 
     console.log(merchant) 
     this.merchant = merchant; 
     this.getMerchantPaymentChannels(); 
     }) 
    } 

    ngOnDestroy() { 
    this.merchantSubscribe.unsubscribe(); 
    } 

문제 : 자식 요소 중 하나가 처음 리로디드 페이지 열 때 모든 것이 좋다. 그러나 하위 구성 요소의 탭을 변경하고 처음에 열린 하위 구성 요소를 다시 방문하면 가입 된 데이터를 가져 오지 못합니다. 그러나 ngOnInit 기능이 다시 작동합니다. 또한 getMessage() in service도 작동합니다. 하위 구성 요소 subscribe 콜백 만 데이터를 다시 수신하지 않습니다.

답변

0

난 당신뿐만 아니라 서비스에의 getMessage를 호출 당신의 아이 컴퍼넌트 내에서 함수가 필요합니다 생각하거나 이것은 다소 당신이 @Input 데코레이터

1

를 통해 부모 구성 요소에서받은 메시지 또는 데이터를 전달해야 오래된 질문이지만 나는 같은 문제를 겪었다. 이 문제를 해결하기 위해 수행 한 작업은 제목 대신 BehaviorSubject를 사용하는 것입니다. BehaviorSubject는 이전에 설정된 값을 "기억"하지만 Subject는이를 기억하지 않습니다.

제목을 구독하면 변경 사항 만 수신하지만 아무 것도 없다면 아무 것도 일어나지 않습니다. 부모가 Subject의 다음 값을 설정하면 메시지를 발송하지만 발송 된 정보는 보관하지 않습니다. 그리고 당신은 탭을 사용하고 있기 때문에, 그 부모는 한 번만 보내고 그게 전부입니다. 자녀가 첫 번째 "변경"을 가져 오지만 탭을 변경할 때 부모에 대한 변경 사항이 없으므로 다른 메시지를 보내지 않습니다.

제목이 BehaviorSubject로 변경되었을 때 수행해야하는 유일한 차이점은 BehaviorSubject의 초기 값으로 설정되어 있다는 사실을 오해했을 가능성이 있습니다.

private subject = new BehaviorSubjectSubject<any>(''); 

sendMessage(message: any) { 
    this.subject.next(message); 
} 

clearMessage() { 
    this.subject.next(''); 
} 

getMessage(): BehaviorSubject<any> { 
    return this.subject; 
} 

또한 반환 유형을 BehaviorSubject로 변경하고 asObservable을 제거했습니다.

자식을 초기화 할 때 공백 값 (또는 초기 BehaviorSubject를 설정 한 값)을 갖지만 부모가 다음 값을 설정하면 변경 내용을 가져오고 BehaviorSubject도 값을 유지합니다. 따라서 탭을 변경하면 횟수에 관계없이 탭으로 돌아갑니다.

이런 식으로하는 죄수가 있는지 모르겠지만 지금은 나에게 잘 작동하는 것 같습니다. 변경 사항이 있거나 더 나은 방법을 찾으면 업데이트 할 것입니다.

관련 문제