Angular 2 次刷新本地存储值变化的视图

Angular 2 refresh views on local storage's value change

我有一个导航栏,可以打印出用户的名字和姓氏。这两个变量都取自组件 init 上的本地存储。 我有一个模态,在模态中我可以更改登录用户的姓名和姓氏并将它们再次放入本地存储中。如果我成功更改它们,我想用新的名字和姓氏更新导航栏。

模态框和导航栏是两个不同的组件。

我怎样才能做到这一点?

解决方案1:我想手动修改变量,而新数据(姓名)的post已成功执行。 我可以从模态修改另一个组件(导航栏)的变量吗?

解决方案 2:调用 location.reload 强制使用本地存储中的新数据自动更新所有视图。

解决方案 3:使用商店

谢谢

为 getting/setting 本地存储创建一个包装器服务,它也会在设置时发出。模式调用,例如 this.storageService.setItem('foo', 'bar'),而导航栏已订阅 this.storageService.changes$

虽然在写入存储时会发出一个事件,但它只会在同一域的其他 windows 中发出。