在实现Ionic应用上的缓存时,遇到一些有意思的需求。
要实现这个功能的话,在Ionic有一个很简单的做法就是,直接在模板上加一个cache-view="false"
<ion-view cache-view="false" view-title="My Title!">
....
</ion-view>
这样的话,我们就可以很简单的实现这个功能了。但是问题来了,当我们后退的时候页面就会特定慢——因为没有缓存。
这时试着寻找了别的方法,如:
$state.go($state.current, {}, {reload: true});
又或者是:
$window.location.reload(true)
但是不能像预期一样工作。。
于是便想了个方法,就是判断是不是后退。如果不是的话,调用数据:
$scope.$on("$ionicView.beforeEnter", function() {
function clearCacheForDetailPage() {
var history = $ionicHistory.forwardView();
var isLastViewCommentPages = history && history.stateName && (history.stateName === 'CommentView');
if (!isLastViewCommentPages) {
init();
}
}
clearCacheForDetailPage();
})
即,在这个时间调用init()方法,随后在首页清除数据:
$scope.$on("$ionicView.beforeEnter", function() {
var clearHistoryForIndexPage = function() {
var history = $ionicHistory.forwardView();
if(history && history.stateName) {
$ionicHistory.clearHistory();
}
};
clearHistoryForIndexPage();
});
随后又遇到了一个有意思的问题,就是Directive是有缓存的,这时候又要逐一修改这些Directvie:
做法大致如下:
link: function(scope, element, attrs) {
function render (value) {
//
);
render($scope.value);
scope.$watch("value",function(value) {
render(value);
});
}
围观我的Github Idea墙, 也许,你会遇到心仪的项目