zoukankan      html  css  js  c++  java
  • angular中$cacheFactory缓存的使用

      最近在学习使用angular,慢慢从jquery ui转型到用ng开发,发现了很多不同点,继续学习吧;

      首先创建一个服务,以便在项目中的controller中引用,服务有几种存在形式,factory();service();constant();value();provider();其中provider是最基础的,其他服务都是基于这个写的,具体区别这里就不展开了,大家可以看看源码;服务是各个controller之间通话的重要形式,在实际项目中会用的很多,下面是代码:

    angular.module('yourApp').factory('myCache',function($cacheFactory){
        return $cacheFactory('myData');
    });

      这里‘myCache’是服务名称,且是唯一,针对一个特定的缓存对象,存在于浏览器中,供控制器引用:

    angular.module('yourApp').
        controller('userCtrl',['$scope','$http','myCache',function($scope,$http,myCache){
         //监测是否已经存在缓存数据,如果有就获取然后该干嘛干嘛去 var cache=myCache.get('myData'); if(cache){ $scope.variable=cache; }else{ //从接口获取数据,put到缓存中 var jurl='/data/getdata'; $http({ url: jurl, method: "GET", data: "{'query':'somevalue'}", headers: { 'Content-Type': 'application/json' } }).success(function (data, status, headers, config) { //something in success
              
    }).error(function (data, status, headers, config) { //something in error }); } }])

    页面第一次打开时,会从接口中获取数据,当页面发生路由跳转时,这些数据是一直被缓存的,路由跳转到有需求的页面,监测到已经被缓存,就不用向服务器请求数据了,如果是页面被关闭或者是刷新了页面,缓存会丢失,重新向、请求数据并缓存;

    这是个简单的示例,在实际项目中的数据会复杂些,比如为了页面优化减少而将页面数据集合请求,减少数据请求次数,获取到数据后分配的route的各个template中,数据结构会复杂些;

    目前还没有缓存比较大的数据的示例,理论上这里的cache是javascript中的一个object对象,所以应用中cache的大小限制或大小对浏览器页面性能的影响,还不是很清楚,继续深扒,发现了不同点再来续更。

      原文地址:angular中$cacheFactory缓存的使用薛陈磊 | Share the world

  • 相关阅读:
    Apache Calcite对多种异构数据源的支持
    如何成为优秀的技术Leader
    Spring @Scheduled执行原理解析
    Google Guava官方教程
    数据倾斜
    服务框架 Pigeon 的设计与实现
    递归算法的简单应用
    让ListView中的控件失去焦点:android:descendantFocusability="blocksDescendants"
    android:layout_weight的真实含义/android:layout_gravity的条件
    复杂布局的时候,不要复制布局
  • 原文地址:https://www.cnblogs.com/xuechenlei/p/5784937.html
Copyright © 2011-2022 走看看