web-dev-qa-db-fra.com

Désactiver la mise en cache des modèles dans AngularJS avec ui-router

J'ai remarqué que de temps en temps je modifierais l'un des modèles de mon application AngularJS et qu'au moment de l'exécution, le changement ne serait pas visible. Au lieu de cela, je devrai actualiser l'application et si cela échoue, accédez au chemin du modèle et actualisez-le afin de voir ce changement.

Quel est le meilleur moyen d'empêcher la mise en cache de ces modèles comme ceci? Idéalement, j'aimerais qu'ils soient mis en cache lors de l'utilisation actuelle de l'application Angular, mais que lors du prochain chargement de la page, ils récupèrent les modèles les plus récents et les plus volumineux sans avoir à actualiser manuellement.

J'utilise ui-router si cela fait une différence. Merci!

angularjscaching
14
Xaniff

Vous pouvez utiliser un décorateur et mettre à jour le service $ templateFactory de l'interface utilisateur du routeur pour ajouter un suffixe à templateUrl. 

function configureTemplateFactory($provide) {
    // Set a suffix outside the decorator function 
    var cacheBuster = Date.now().toString();

    function templateFactoryDecorator($delegate) {
        var fromUrl = angular.bind($delegate, $delegate.fromUrl);
        $delegate.fromUrl = function (url, params) {
            if (url !== null && angular.isDefined(url) && angular.isString(url)) {
                url += (url.indexOf("?") === -1 ? "?" : "&");
                url += "v=" + cacheBuster;
            }

            return fromUrl(url, params);
        };

        return $delegate;
    }

    $provide.decorator('$templateFactory', ['$delegate', templateFactoryDecorator]);
}

app.config(['$provide', configureTemplateFactory]);
16
Aman Mahajan

La solution ci-dessus était excellente et ne fonctionnait pas pour les modèles d'URL 

function templateUrl: function($stataParams) { return '/serverUrl?id=' + $stataParams.id + '&cid=' + $stataParams.cid; }

fixé par

function templateFactoryDecorator($delegate) {
    var fromUrl = angular.bind($delegate, $delegate.fromUrl);
    $delegate.fromUrl = function (url, params) {
        if (url !== null && angular.isDefined(url)) {
            if (typeof url == 'function') {
                url = url.call(url, params);
            }
            if (angular.isString(url)) {
             url += (url.indexOf("?") === -1 ? "?" : "&");
             url += "v=" + Date.now().toString();
             }
         }

         return fromUrl(url, params);
     };

     return $delegate;
}
2
Biju Thomas