Angular $templateCache and $stateProvider fix for native ios phonegap/cordova

Question

Angular $templateCache, $stateProvider and ng-include works beautifully in a web browser, but on native ios using phonegap/cordova it won't load templates or go to states

I've gone through the checklist:

• remove <base href="/">
• make sure paths are relative "template.html" vs "/template.html"
• make sure html5Mode is false
• load templates.js before angular
• make sure dependency injections are in place

Here are some examples of what works in a browser but not on native ios.

$stateProvider.state('start', {
    url: '',
    templateUrl: 'templates/start/start.html'
});

and

$state.go('start');

and

<div ng-include=" 'fileFromTemplatecache.html' "></div>

Any idea? I can't find a solution that works.

Answer 1

Others will come across this issue I'm sure. The solution has to do with the config.xml file at the root of your mobile build. This is what worked for me...

<allow-navigation href="file://*/*"/>
<allow-navigation href="*"/>
<allow-intent href="file://*/*"/>
<allow-intent href="*"/>
<access origin="file://*/*"/>
<access origin="*"/>