Я хочу общаться между родительскими и дочерними вкладками. Я получу некоторые данные на дочерней вкладке (другой компонент, чем родительский), а затем отправлю эти данные родителю.
Я думаю, что использование браузера localstorage является правильным способом. Поэтому я вставляю данные в localstorage и хочу, чтобы родительский компонент автоматически воспринял это изменение, получил данные из localstorage и закрыл дочернее окно.
У меня есть 2 компонента для родительских и дочерних окон и один сервис для localalstorage подписки. Проблема в том, что родительский компонент не видел изменений, потому что я меняю тему с «следующий» от дочернего.
Сервисный код:
export class ObserveLocalStorageService {
private storageSub= new Subject<any>();
watchStorage(): Observable<any> {
return this.storageSub.asObservable();
}
setItem(key: string, data: any) {
localStorage.setItem(key, data);
this.storageSub.next('changed');
}
removeItem(key) {
localStorage.removeItem(key);
this.storageSub.next('changed');
}
}
Код дочернего компонента:
export class FbLoginPopupComponent implements OnInit {
uriObject: any;
constructor(private storageService: ObserveLocalStorageService,
private activatedRoute: ActivatedRoute) {}
ngOnInit() {
this.activatedRoute.fragment.subscribe((fragment: string) => {
console.log('My hash fragment is here => ', fragment);
this.uriObject = JSON.parse('{"' + decodeURI(fragment)
.replace(/"/g, '\\"')
.replace(/&/g, '","')
.replace(/=/g,'":"') + '"}');
if (this.uriObject['access_token']) {
this.storageService.setItem('fb_tk', true);
this.storageService.setItem('fb_tk_is', this.uriObject['access_token']);
} else {
this.storageService.setItem('fb_tk_err', this.uriObject['error']);
this.storageService.setItem('fb_tk_err_desc', this.uriObject['error_description']);
}
}
}
Наконец, мой родительский компонент выглядит так:
export class FacebookLoginComponent implements OnInit, OnDestroy {
private authWindow: Window;
constructor(private storageService: ObserveLocalStorageService) {}
ngOnInit() {
this.storageService.watchStorage().subscribe((data: string) => {
console.log(data); <------------------ **problem is here. data is not loging**
});
launchFbLogin() {
this.authWindow = window.open('https://www.facebook.com/v2.11/dialog/oauth?' +
'&response_type=token' +
'&display=popup' +
'&client_id=123321123321123321123321' +
'&display=popup' +
'&redirect_uri=https://localhost:44312/auth/fb-login-popup' +
// '&redirect_uri=https://localhost:44312/facebook-auth.html' +
'&scope=email',null,'width=600,height=400');
}
}
Я не могу найти решение. Пожалуйста, помогите.
Спасибо