Angular2 本地存储 Subject()

Question

我会向您解释我的（可能很小的）问题:)

我正在尝试创建一个 localStorage 来设置和获取一些数据（对象数组）。我有一个组件在我的本地存储阵列中添加对象，另一个组件获取此数据。

我在 ionic2 选项卡应用程序上，当我设置本地存储时，我得到它的另一个视图没有更新...

我想我必须使用 RxJs 主题，但我不知道如何正确使用它。

看看我现在的代码

// LocalStorageService.ts

export class LocalStorageService {
  public bookmarks: Subject<any> = new Subject()

  constructor (public alertCtrl: AlertController) {}


  setUserBookmarks(bookmarks: any) {
    localStorage.setItem("myData", JSON.stringify(bookmarks));
    this.bookmarks.next(bookmarks)
  }

  getUserBookmarks() {
    return JSON.parse(localStorage.getItem("myData"))
  }

然后，我的组件

// Component where I set data

export class ListEventsComponent {

 bookmarks: any

 constructor(private navParams: NavParams, 
 private localStorageService: LocalStorageService) {}

 ngOnInit() {
  this.localStorageService.bookmarks.subscribe(bookmarks => {
    this.bookmarks = bookmarks
  })
 }


 bookmark(event) {
  this.localStorageService.setUserBookmarks(event)
 }
}

最后一个：

// Component where I get data

export class AboutPage {
 public bookmarks: any

 constructor(public navCtrl: NavController, private   localStorageService:LocalStorageService) {
   this.localStorageService.bookmarks.subscribe(bookmarks => {
     this.bookmarks = bookmarks
     console.log(bookmarks)
   })
 }

 removeBookmark(eventID: string) {
   this.localStorageService.removeUserBookmark(this.bookmarks, eventID)
 }
}

那么，如何在设置第一个组件时更新第二个组件？提前谢谢你，如果我不清楚，请不要犹豫说出来:)

Answer 1

问题是你的第二个组件在第一个调用 next 之后订阅，所以他没有得到任何数据。对于这种情况，您应该使用 BehaviorSubject 来获取最新的发射值：

 public bookmarks: BehaviorSubject<any> = new BehaviorSubject([]); // The initial value

Angular2 本地存储 Subject()

Angular2 local storage Subject()

subject

observable

rxjs

typescript

angular