在AngularJs中如何實現禁止模板緩存

這篇文章主要介紹了AngularJs 禁止模板快取的方法，小編覺得挺不錯的，現在分享給大家，也給大家做個參考。一起跟著小編過來看看吧

本文介紹了AngularJs 禁止模板緩存的方法，分享給大家，也給自己留個筆記，具有如下：

因為AngularJs的特性（or瀏覽器本身的快取？），angular預設的HTML模板載入都會被快取起來。導致每次修改完模板之後都得經常需要清除瀏覽器的快取來保證瀏覽器去獲得最新的html模板，自己測試還好，但如果更新了伺服器的模板內容，用戶可不會每個都配合你去清除瀏覽器的快取。故這還真是個大問題。

app.config(function($routeProvider, $locationProvider) { 
 $routeProvider 
  .when('/Book/:bookId/ch/', { 
  templateUrl: 'chapter.html', 
  controller: 'ChapterController' 
 }); 
});

方法一：在模板檔案路徑後加時間戳（or 其他隨機數），強制AngularJs每次從伺服器載入新的模板

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快取起來。

上面是我整理給大家的，希望今後對大家有幫助。

相關文章：

在vue中如何實作閱讀全文

在vue中如何取得dom元素

在js中如何實作轉換時間戳格式

在nginx上部署vue專案（詳細教學）

在JavaScript如何實作元素滾動條循環追加內容

在vue swiper如何實作側滑選單效果

以上是在AngularJs中如何實現禁止模板緩存的詳細內容。更多資訊請關注PHP中文網其他相關文章！