如何在更新appCache时刷新部分视图?

时间:2013-08-30 10:58:36

标签: angularjs

我正在使用angularjs路由:

angular.module('questionModule', []).
  config(['$routeProvider', function ($routeProvider) {
      $routeProvider.
      when('/questions', { templateUrl: 'partials/questions.htm', controller: QuestionsController }).
      when('/questions/:Id', { templateUrl: 'partials/questionDetail.htm', controller: QuestionDetailCtrl }).
      otherwise({ redirectTo: '/questions' });
  } ]);

在此页面上:

<html ng-app="questionModule" manifest="AngularManifest.appcache" >
<head>
    <META HTTP-EQUIV="CACHE-CONTROL" CONTENT="NO-CACHE">
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js" ></script>
    <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.min.js"></script>
    <script src="question.js" type="text/javascript"></script>
    <script src="app.js" type="text/javascript"></script>
    <script src="appCacheBootstrap.js" type="text/javascript"></script>
</head>
<body>
    <h2>This example uses angular js routing to display partial views</h2>
    <div ng-view></div>
</body>

然而,当我对其中一个部分视图文件进行更改并更新清单文件以强制刷新应用程序缓存时,不会显示更改。我必须访问chrome:// appcache-internals /并删除应用缓存以查看更新。我该怎么做这个自动?当我在不使用路由的页面上时,应用程序缓存似乎正确刷新。

以下是我处理清单文件更改的方法:

$(function () {
    if (window.applicationCache) {
        applicationCache.addEventListener('updateready', function () {
            console.log("appcache status: " + window.applicationCache.status);
            if (window.applicationCache.status == window.applicationCache.UPDATEREADY) {
                window.applicationCache.swapCache();
                if (confirm('A new version of this site is available. Load it?')) {
                    window.applicationCache.update();
                    window.location.reload();
                }
            }
        });
    }
    {
        console.log("null window.applicationCache");
    }
});

当我在augularjs路由页面窗口时.applicatonCache为null。

2 个答案:

答案 0 :(得分:2)

你是否在包含“null window.applicationCache”消息的curlies之前错过了'else'?

如果是这样,那么正确的代码片段就是:

$(function () {
    if (window.applicationCache) {
        applicationCache.addEventListener('updateready', function () {
            console.log("appcache status: " + window.applicationCache.status);
            if (window.applicationCache.status == window.applicationCache.UPDATEREADY) {
                window.applicationCache.swapCache();
                if (confirm('A new version of this site is available. Load it?')) {
                    window.applicationCache.update();
                    window.location.reload();
                }
            }
        });
    }
    else{
        console.log("null window.applicationCache");
    }
});

否则,无论缓存是否处于活动状态,您每次都会打印null applicationCache消息。不要相信你在控制台中读到的一切:)。

答案 1 :(得分:0)

事实证明,因为我是通过asp.net开发服务器运行网站而不是IIS,所以它不起作用。我怀疑开发服务器添加了标题以阻止它工作。