如何在angular 7中订阅本地存储
我想在父选项卡和子选项卡之间进行通信。我将在子选项卡(不同的组件,然后是父组件)中获取一些数据,然后将这些数据发送给父组件。 我认为使用浏览器本地存储是正确的方法。所以我要将数据插入localstorage,并希望父组件自动吸收此更改,从localstorage获取数据并关闭子窗口 我有两个用于父窗口和子窗口的组件,一个用于订阅本地存储的服务。问题是父组件并没有看到更改,因为我正在用子组件的“下一个”更改主题 服务代码为:如何在angular 7中订阅本地存储,angular,typescript,browser,angular-local-storage,Angular,Typescript,Browser,Angular Local Storage,我想在父选项卡和子选项卡之间进行通信。我将在子选项卡(不同的组件,然后是父组件)中获取一些数据,然后将这些数据发送给父组件。 我认为使用浏览器本地存储是正确的方法。所以我要将数据插入localstorage,并希望父组件自动吸收此更改,从localstorage获取数据并关闭子窗口 我有两个用于父窗口和子窗口的组件,一个用于订阅本地存储的服务。问题是父组件并没有看到更改,因为我正在用子组件的“下一个”更改主题 服务代码为: export class ObserveLocalStorageServ
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 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');
}
}
导出类FacebookLoginComponent实现OnInit、OnDestroy{
私有authWindow:窗口;
构造函数(私有存储服务:observelocstorageservice){}
恩戈尼尼特(){
this.storageService.watchStorage().subscribe((数据:字符串)=>{
console.log(数据);是否两个组件中使用的storageService
不是同一个实例?是否可以尝试从FacebookLoginComponent
中调用storageService.setItem
,并检查console.log()
是否为您运行?如果是这种情况,您可能需要检查这些组件是否属于同一模块。这可能会对您有所帮助。您是否找到了解决方案?
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');
}
}