带缓存处理的两种写法
过程:点击button触发load()方法,请求数据成后显示到页面中。如果已经请求过则从缓存中读取。
写法1:
function demo(){ if (demo.cache == undefined) { return $http.get('https://api.github.com/users/github') .then(function(data, status, headers){ demo.cache = data.data; return $q(function (resolve, reject) { resolve(demo.cache); }); }) }else { console.log('from cache'); return $q(function (resolve, reject) { resolve(demo.cache); }); } } // 点击加载 $scope.load = function() { demo().then(function(data){ $scope.list = data.data; }) }
写法2:
感觉第二种写法好些,注意细节。
function demo(){ let deferred = $q.defer(), that = this;if (that.cache == undefined) { $http.get('https://api.github.com/users/github') .success(function(data, status, headers){ that.cache = data; deferred.resolve(that.cache); }) }else { console.log('from cache'); deferred.resolve(that.cache); } return deferred.promise; } // 点击加载 $scope.load = function() { demo().then(function(data){ $scope.list = data; }) }
写法3 利用闭包缓存结果
// 利用闭包缓存结果 function demo2() { let defer = $q.defer(), cache; return function() { if (cache == undefined) { $http.get('https://api.github.com/users/github') .then((res) => { cache = res.data; defer.resolve(cache); }) }else { console.log('from cache'); defer.resolve(cache); } return defer.promise; } } // 点击加载 let startDemo = demo2(); $scope.load = function() { startDemo().then(function(data){ $scope.list = data; }) }