我试图在应用程序的结帐过程中在页面之间传递数据,但它没有按照应有的方式工作.我做了一些阅读,大多数人建议使用服务,但唯一的问题是当页面刷新(用户点击刷新或稍后返回)时,服务中的所有数据都会消失.这是有道理的,因为服务中的数据并不是持久的,而是导致问题.
所以问题是:如何在angularJS中的页面之间传递数据,并保持页面刷新后传递的数据?
这是我的代码到目前为止(我尝试使用查询字符串):
.service('checkoutService', function checkoutService($location, Address, $routeParams, TicketGroup) { var ticket_quantity = 0; var ticket_group = {}; var selected_address = {}; this.loadInformation = function() { if(!ticket_quantity && $routeParams.ticket_quantity) ticket_quantity = $routeParams.ticket_quantity; if(!ticket_group && $routeParams.ticket_group_id) ticket_group = TicketGroup.get({id: $routeParams.ticket_group_id}); if(!selected_address && $routeParams.address_id) selected_address = Address.get({id: $routeParams.address_id}); } this.setTicketQuantity = function(quantity) { ticket_quantity = quantity; $location.path().search({ticket_quantity: quantity}); } this.getTicketQuantity = function() { return ticket_quantity; } this.setTicketGroup = function(object) { ticket_group = object; $routeParams.ticket_group = object.id; } this.getTicketGroup = function() { return ticket_group; } this.setSelectedAddress = function(object) { selected_address = object; $routeParams.address_id = object.id; } this.getSelectedAddress = function() { return selected_address; } });
Jared Reeves.. 15
有几个选项可以做到这一点,
对于较小的数据集,您可以使用$ cookieStore,以获得低于4k的数据
另一个选项,特别是对于大型数据集,将使用本地存储,然后在页面加载/重新加载时检索数据.
如果它只是一个非常少量的数据,或者通过多个页面使用的数据,你可以使用$ rootscope,但这不是最好的选择,因为它就像污染全局名称空间一样.
最后一个选项,取决于如何检索数据,可以实现服务,这基本上是可以传递到各种角度范围的单例.
注意:只有前两个是持久的.
在您的情况下,我认为使用本地存储或cookiestore将是您的最佳选择.您正在尝试使用服务,如果您不希望它是持久的(保留页面或页面刷新),这将是合适的.服务是由角度管理的单例,当注入时,您将在每次注入时获得对同一对象的引用.但是,当返回到页面时,需要重新初始化此单例,从而丢失所有先前的数据.使服务持久化的唯一方法是从其他地方加载来自数据库,本地文件或noSQL的数据.但是,我认为这不是你真正想要的.
如果您有兴趣寻求本地存储实现,那么请查看这些模块angular-local-storage,ngStorage或这个答案
如果您想使用cookiestore,请查看此答案
有几个选项可以做到这一点,
对于较小的数据集,您可以使用$ cookieStore,以获得低于4k的数据
另一个选项,特别是对于大型数据集,将使用本地存储,然后在页面加载/重新加载时检索数据.
如果它只是一个非常少量的数据,或者通过多个页面使用的数据,你可以使用$ rootscope,但这不是最好的选择,因为它就像污染全局名称空间一样.
最后一个选项,取决于如何检索数据,可以实现服务,这基本上是可以传递到各种角度范围的单例.
注意:只有前两个是持久的.
在您的情况下,我认为使用本地存储或cookiestore将是您的最佳选择.您正在尝试使用服务,如果您不希望它是持久的(保留页面或页面刷新),这将是合适的.服务是由角度管理的单例,当注入时,您将在每次注入时获得对同一对象的引用.但是,当返回到页面时,需要重新初始化此单例,从而丢失所有先前的数据.使服务持久化的唯一方法是从其他地方加载来自数据库,本地文件或noSQL的数据.但是,我认为这不是你真正想要的.
如果您有兴趣寻求本地存储实现,那么请查看这些模块angular-local-storage,ngStorage或这个答案
如果您想使用cookiestore,请查看此答案