templateCaching on uibmodal

Question

I've been working for a while to get my application to work when a user goes offline. I've used $http and templateCache to cache my templates which is fine. But, one issue i can't seem to solve in a "good" way is the $uibmodal. I have cached the template

 $http.get('tpl/modal.html', {cache:$templateCache});

and changed the controller to get the template from cache instead of templateUrl when opening the modal.

templateUrl: 'tpl/modal.html' //before
template: $templateCache.get('tpl/modal.html') //after

The problem here is that i get "status 200" on top of my template. And "OK" on the bottom. This is the closest i get to a solution i can accept even though i feel it's a "hack". Is it a better way to do this? if not; How can i remove the status-code in my current solution?

Answer 1

According to the docs if the template has been loaded into the $templateCache already then you shouldn't need to adjust your directive parameters. You should be able to use your existing

templateUrl: 'tpl/modal.html'

AngularJS will check it's existing template cache first and serve it up from there if it exists and load it across the network as a fall back.

Personally i use a grunt plugin to compile, minify and pre-load all my templates. When I implemented this I didn't need to change anything on my exiting directives / components.