AngularJS directive templateUrl doesn't update

angularjs, angularjs-directive, javascript

Solution

The reason for that is that Angular fetch a file only once at the begining. You can try to use templateUrl as function and append timestamp so you get new template url each time.

templateUrl: function() {
    return 'partials/app-mainsec.html?' + +new Date();
}

But probably, it will refresh your directive only when directive will be compiled.

Problem

I have a problem with angular directives. When I edit the content of a file referenced via `templateUrl`, the result doesn't appear until I delete the cache. I have the following code: Directive.js ``` .directive('appMainsec',['$window', function ($window){ var objectMainSec = { restrict: 'A', templateUrl: 'partials/app-mainsec.html', controller: function (){}, controllerAs: 'MainSectCtrl', link: function ($scope,elemnt,attr){ elemnt.css('height', ($window.innerHeight - ($window.innerHeight * .25)) + 'px'); } }; return objectMainSec; }]); ``` app-mainsec.html ``` <div><h1>Principal</h1></div> ``` and index.html ``` ... <div app-mainsec></div> ... ``` When I change `<h1>Hi</h1>` to `<h1>Hello</h1>`, the view of directive doesn't update until I delete the cache.

Original source

Related problems