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


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM