33

私は、いくつかのディレクティブを使用して AngularJS アプリに取り組んでいます。ディレクティブのテンプレートは別の html ファイルに保存されます。これらのテンプレートを編集するとき、ブラウザはリロード後に変更を検出せず、常にキャッシュ バージョンを使用します。ソース コードへのその他の変更が検出され、リロードが発生します。

問題は、テンプレートをロードするときに AngularJS によって使用されると思われる $templateCache にあると思います。

AngularJS 1.0.2 のソース コードで見つけたのは、compileTemplateUrl() の一部である 4317 行から次のとおりです。

$http.get(origAsyncDirective.templateUrl, {cache: $templateCache})

他の誰かがこの種の問題を抱えていたのか、AngularJS にいつキャッシュするか、いつキャッシュしないかを伝える方法があるかどうか疑問に思っています。

4

3 に答える 3

15

これは JavaScript アプリであるため、テンプレート キャッシュはブラウザーに保存されます。開発者ツールを使用して、実際に $cache を手動でフィードするか、ブラウザーがテンプレートをキャッシュしないようにすることができます (本番環境では、キャッシュは問題にならないように思われるため)。

キャッシュの強制フィードの場合:

function Main($cache) {
    $cache.data['first.html'] = {value: 'First template'};
    $cache.data['second.html'] = {value: '<b>Second</b> template'};

}

Main.$inject = ['$xhr.cache'];​

このfiddleで動作することを確認してください。

ブラウザがテンプレートをキャッシュしないようにするには (この問題に関するこのGoogle グループの投稿から引用):

私のチームと私は、この同じ問題に遭遇しました。Chrome を使用して開発するための解決策は、開発者ツールを開き、右下隅にある歯車を選択することでした。次に、[ネットワーク] - [キャッシュを無効にする] を選択します。

これにより、部分/テンプレートのキャッシュの問題がすべて修正されました。

于 2012-11-19T09:53:56.680 に答える
1 
app.controller('someCtrl', function ($scope, $cacheFactory, templateRequest)
{   
    $scope.refreshTemplate = function ()
    {
      var tpl = "<template name>";
      $cacheFactory.get('templates').remove(tpl);
      $templateRequest(tpl).then(function ok(){
          console.log("Template "+tpl+" loaded.");
      });
     }
   ...
  }

次に、refreshTemplate 関数を呼び出すと、再読み込みが発生します

于 2016-02-24T12:52:11.433 に答える