因為AngularJs的特性(or 瀏覽器本身的緩衝。),angular預設的HTML模板載入都會被緩衝起來。導致每次修改完模板之後都得經常需要清除瀏覽器的緩衝來保證瀏覽器去獲得最新的html模板,自己測試還好,但如果更新了伺服器的模板內容,使用者可不會每個都配合你去清除瀏覽器的緩衝。故這還真是個大問題。
app.config(function($routeProvider, $locationProvider) { $routeProvider .when('/Book/:bookId/ch/', { templateUrl: 'chapter.html', controller: 'ChapterController' });});
方法一:在模板檔案路徑後加時間戳記(or 其他隨機數),強制AngularJs每次從伺服器載入新的模板
<pre name="code" class="javascript">app.config(function($routeProvider, $locationProvider) { $routeProvider .when('/Book/:bookId/ch/', { templateUrl: 'chapter.html' + '?datestamp=' + (new Date()).getTime(), controller: 'ChapterController' });});
不過這種方法太不美觀了。。。。
方法二:使用$templateCache清除緩衝
// 禁止模板緩衝app.run(function($rootScope, $templateCache) { $rootScope.$on('$routeChangeStart', function(event, next, current) { if (typeof(current) !== 'undefined'){ $templateCache.remove(current.templateUrl); } });});
在配置 路由地址後,即在app.config之後添加這段代碼,可禁止AngularJs將templateUrl緩衝起來。