监视LocalStorage中的更改angular2

Question

我在LocalStorage和ngOnInit钩子中存储了一些对象我将这些数据接收到数组中，该数组使用* ngFor在模板中显示。我如何监视LocalStorage中的更改并自动更新视图？

Answer 1

你想要的是一个主题。看看这里的文档（https://github.com/Reactive-Extensions/RxJS/blob/master/doc/api/subjects/subject.md）

For a quick example, something like this: 
    @Injectable() 
export class StorageService { 
    ... 
    private storageSub= new Subject<boolean>(); 
    ... 

    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'); 
    } 
} 

Inside Component 

constructor(private storageService: StorageService ){} 
ngOnInit() { 
this.storageService.watchStorage().subscribe((data:string) => { 
// this will call whenever your localStorage data changes 
// use localStorage code here and set your data here for ngFor 
}) 

}