Question

将Angular Scope从上次浏览器会话缓存到新加载的最佳技术是什么？

这可能吗？

包括控制下次创建完整范围的缓存吗？

当从后端加载新数据时，覆盖加载的缓存范围？

Answer 1

这与如何使用javascript在浏览器中缓存数据有关。

有一些解决方案你可以专门研究角度：

ngStorage：本地和会话存储的角度方式
angular-local-storage：带有Cookie回退的简单本地存储
$cookies：Angular提供的服务包裹Cookie访问

Angular服务可用于在同一会话中的路由之间共享范围。但是，如果您关闭浏览器，则需要本地/会话存储，Cookie或服务器端解决方案之一。

$饼干

Cookies是一种直接的键值存储。易于使用，可快速保存数据。

angular.module('cookiesExample', ['ngCookies'])
.controller('ExampleController', ['$cookies', function($cookies) {
    // Retrieving a cookie
    var favoriteCookie = $cookies.get('myFavorite');
    // Setting a cookie
    $cookies.put('myFavorite', 'oatmeal');
}]);

不要使用Cookie来存储大量数据，并将其限制为应在每次请求时发送的数据，例如身份验证令牌。

ngStorage

AngularJS模块，使Web存储以 Angular Way 工作。包含两项服务：$localStorage和$sessionStorage。

bower install ngstorage

通过引用传递$localStorage（或$sessionStorage）在$scope的普通ol＆＃39; JavaScript的：
$scope.$storage = $localStorage;
并像你一样使用它 - 已经知道：
<body ng-controller="Ctrl">
    <button ng-click="$storage.counter = $storage.counter + 1">{{$storage.counter}}</button>
</body>
或者，使用$default()方法指定默认值：
$scope.$storage = $localStorage.$default({
    counter: 42
});
通过此设置，更改将自动同步 $scope.$storage，$localStorage和localStorage - 甚至跨越不同的浏览器标签！

local storage demo

angular-local-storage模块提供了多种存储数据的方法。它的功能丰富，并提供高级选项和自定义。

window.angular.module('demoModule', ['LocalStorageModule'])
    .config(function(localStorageServiceProvider) {
        localStorageServiceProvider.setPrefix('demoPrefix');
        // localStorageServiceProvider.setStorageCookieDomain('example.com');
        // localStorageServiceProvider.setStorageType('sessionStorage');
    })
    .controller('DemoCtrl',
        function($scope, localStorageService) {
            $scope.localStorageDemo = localStorageService.get('localStorageDemo');

            $scope.$watch('localStorageDemo', function(value) {
                localStorageService.set('localStorageDemo', value);
                $scope.localStorageDemoValue = localStorageService.get('localStorageDemo');
            });

            $scope.storageType = 'Local storage';

            if (localStorageService.getStorageType().indexOf('session') >= 0) {
                $scope.storageType = 'Session storage';
            }

            if (!localStorageService.isSupported) {
                $scope.storageType = 'Cookie';
            }

            $scope.$watch(function() {
                return localStorageService.get('localStorageDemo');
            }, function(value) {
                $scope.localStorageDemo = value;
            });

            $scope.clearAll = localStorageService.clearAll;
        }
    );

如何缓存角度范围

1 个答案:

$饼干

ngStorage

local storage demo

其他信息