javascript - Angular 处理不正确的缓存数据

Question

好吧，这可能是一篇很长的文章，但请不要点击离开，您可能知道一个简单的答案。

案例:

假设您构建了一个 Angular 应用程序，人们可以在其中登录系统执行一些操作，然后可能会再次注销。该应用程序将使用工厂和服务从 API 收集数据，为了使 application 加载得更快，您将这些数据保存在如下变量中:

app.factory("divisionService", function (api, $http, $q) {
var division = {};
var divisionArray = [];
var mergedUserList = [];
return {
    getList: function () {
        var d = $q.defer();
        if (divisionArray <= 0) {
            $http.get(api.getUrl('divisionWithUsers', null))
                .success(function (response) {
                    divisionArray = response;
                    d.resolve(divisionArray);
                });

        }
        if (divisionArray.length > 0) {
            d.resolve(divisionArray);
        }
        return d.promise;
    },

这将确保如果用户尝试使用使用 divisionService 的 Controller ，则该用户将立即获取已获取的数据。

问题:

现在用户注销，另一个用户登录(不刷新/重新加载)页面。一旦 Controller 调用这个工厂，它就已经认为它有正确的列表，这意味着返回将与以前的用户相同，但是这个数据可能不正确!

由于所有 Angular 服务都是单例，因此服务不会在注销时被销毁，即使它应该被销毁。

显而易见的答案

这个问题的答案可能是:“那么不要将数据存储在变量中”，因为这会起作用，大量数据可能会使页面内容加载缓慢。

所以我的问题是在上述情况下你会怎么做？您真的需要处理每次请求时加载数据，还是 angular 提供了解决此问题的智能方法？

Answer 1

创建一个clear()函数

将 clear() 函数添加到您的 divisionService 工厂，它将负责清空缓存的数据结构(数组、对象...)

app.factory("divisionService", function () {
    var division = {};
    var divisionArray = [];
    var mergedUserList = [];
    return {
        clear: function(){
            // Clear the cached data

            for (var key in division)
            {
                delete division[key];
            }

            divisionArray.length = 0;

            // ...
        },
        getList: ...
    }
});

并在退出时调用此函数

function logout(){
    divisionService.clear();
}

刷新应用

如果您不想处理清除缓存数据(例如调用 divisionService.clear())，您也可以在注销时刷新整个应用程序

function logout(){
    $window.location.reload();
}

这将导致整个应用程序重新加载，所有临时(基于变量的)缓存数据将被清除