angularjs 页面缓存及动态刷新解决方案

1、准备工做

　　框架：angularjs 

　　ui组件库：ionic1  

2、页面缓存cache

　　路由设置cache参数，true为缓存，false为不缓存，代码以下：

angular.module('app',["AppCtrl"])   //依赖注入AppCtrl控制器module
.config(function($stateProvider){
$stateProvider
.state("home",{
    url:"/home",    //定义路由的名称
    templateUrl:"./home.html",    //html视图相对路径
    controller:"AppCtrl",  //定义视图对应对的控制，须要注入
    cache:true     //设置缓存，true为页面缓存，false不缓存
})
})

3、动态刷新

　　使用ionic组件ion-view的生命周期来跳过缓存，达到动态刷新的效果（页面使用ion-view容器）

　　能够经过设置一个全局变量（定义的方式不少，也能够设置一个sessionStorage来充当变量），而后if语句来判断是否执行enter钩子里面的代码。

$scope.$on('$ionicView.enter', function() {
  //每次进入页面都会执行enter钩子
});

　　ion-view还有不少的钩子方法：

 

　　$ionicView.beforeEnter 

　　$ionicView.enter

　　$ionicView.afterEnter

　　$ionicView.beforeLeave

　　$ionicView.leave

 

　　$ionicView.afterLeave

　　$ionicView.unloaded

　　合理的使用就能达到不少咱们须要的效果。