在UI路由器AngularJS禁用模板缓存 [英] Disable template caching in AngularJS with ui-router

问题描述

我注意到，不时我会让我的AngularJS应用程序内更改的模板之一，并在运行时，更改将不可见。相反，我将不得不刷新应用程序，如果失败，转到模板本身的路径和刷新它才能看到这种变化。

I have noticed that from time to time I'll make a change to one of the templates within my AngularJS application and that at runtime, the change won't be visible. Rather, I'll have to refresh the application and if that fails, go to the path of the template itself and refresh it in order to see this change.

什么是这些模板这样的prevent缓存的最佳方式？理想情况下，我希望他们当前使用的角度应用程序的过程中缓存，但下一次我加载页面，他们获取最新和最伟大的模板，而不必手动刷新。

What's the best way to prevent caching of these templates like this? Ideally, I'd like them to be cached during the current use of the Angular application, but that the next time I load the page, they retrieve the latest and greatest templates without having to manually refresh.

我使用的UI路由器如果这使得这里任何区别。谢谢！

I'm using ui-router if that makes any difference here. Thanks!

推荐答案

您可以使用一个装饰和更新UI路由器的$ templateFactory服务追加后缀templateUrl

You can use a decorator and update UI Router's $templateFactory service to append a suffix to 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]);

这篇关于在UI路由器AngularJS禁用模板缓存的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！