在Angular中跨页面刷新保持数据

Question

angular.module('eventTracker', [])

.controller('MainCtrl', ['$scope', 'Event', function($scope, Event){
    $scope.eventData = {}
    $scope.onSubmit = function(){
        Event.Add($scope.eventData)
        $scope.eventData = {}
    }
}])

.factory('Event', function(){
    if (!eventList) {
        var eventList = []
    }
    return {
        Add: function(event){
            eventList.push(event)
        },
        List: eventList
    }
})

大家好，我试图通过页面刷新来持久化eventList，并且我希望得到一些关于为什么会发生这种情况的反馈！ 我宁愿不使用cookies，localstorage或rootscope。 我认为我的服务设置正确，但我猜不是。 任何帮助将不胜感激！ 一切都很完美，除非我刷新页面，我丢失了以前的所有数据。

Answer 1

在浏览器中刷新页面时，Javascript变量中的所有存储数据都将丢失。 如果需要刷新页面，则需要将数据存储在数据库中，并且需要使用AJAX等方式在页面加载时请求数据。

如果您希望更改AngularJS应用程序中的“页面”，则应使用路由和多个视图来模拟多个网页。 这将使您能够在维护服务中存储的任何数据的同时提取不同的页面。

查看AngularJS教程内的路由。

Answer 2

您对跨页面状态的选择可以归结为：

服务器端 - 即通过ajax从服务器持久化/检索

客户端：

• 饼干
• 其他状态存储，如flash（过时），HTML 5本地存储，会话存储
• 在第三方库中包含上述内容，例如http://amplifyjs.com/api/store/

如果它的状态非常少并且上述选项不合适，您可以在URL中对状态进行编码（例如，当您更改页面时作为查询字符串参数），但这不仅仅是最简单的方案。

角度app / scope / rootscope中的所有内容都将在页面刷新时丢失。

这可以看作是一件“好事”，因为它让你有机会清除浏览器内存。 SPA应用程序很棒，但是繁琐的SPA应用程序带来了很多膨胀，并且存在单个坏脚本的风险，从而导致整个应用程序崩溃。 将SPA分解为几个迷你应用程序有很多好处。