監視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 
}) 

}