angular2 通过整个网站传递数据

Question

我有 'cart with clothes to buy' 这样的用户数据。我有一个商店屏幕，用户可以在其中填写购物车。要求是如果我在那个屏幕上并填充购物车以在用户进入结帐屏幕时坚持它。同时，他可以转到我的帐户、我的设置、添加新地址、添加新的信用卡屏幕，当他进入支付订单屏幕或再次返回购物车时，我应该用之前在第一次访问时选择的数据填充这些屏幕商店屏幕。我考虑过将它放入我的主应用程序模块（加载所有其他模块）中的一些全局 common.service.ts 但是当我刷新页面时数据不会保留......我想出的唯一想法是使用 cookie并在注销时清除它们，否则它们会在选项卡关闭时自动清除，但目前我觉得这个解决方案不合适，所以我寻求更好的方法。

Answer 1

您绝对应该使用服务使所有组件和 "pages" 都可以访问数据。对于跨浏览器刷新的数据持久性，您可以使用 cookie 或本地存储。我更喜欢这种类型的数据是本地存储，因为您可以将数据表示为 JSON，然后使用 JSON.stringify 和 JSON.parse 分别保存和检索数据。

一般策略是始终使用可用的内存数据。每次修改数据时，将新版本保存到本地存储。当服务第一次启动时，它应该从本地存储加载以前的数据。

另一个可能的选择是按照与上面为本地存储定义的策略类似的策略将此信息保存在数据库中。使用数据库的一个好处是数据可以跨浏览器持久保存，这是使用本地存储无法做到的。

Answer 2

在 Angular 2 中查看存储状态时，一个流行的工具是 redux (https://www.npmjs.com/package/ng2-redux) and you can use that to store and access state in a session and combine that with the answer from this question ()，您可以订阅 edux 存储中的更改，并在发生更改时将它们保存到本地存储中。这是一个非常可靠的模式，并允许做很多很棒的事情（例如，对于购物车，您可以重播状态，所以如果用户从购物车中删除了一些东西，然后又想把它取回来，这真的很容易）。