cordovaangulartraceursystemjs

Using PhoneGap with Angular2, problems loading templates


It seems like systemjs can't seem to find the template files (my .html views) because it uses absolute paths to load the files. It expects my main app component app.html to be located at file:// but the fact is, PhoneGap places the root of the application pretty deep down the line of file://data/data/app-name/root/... The reason systemjs loads from / might be because i added a <base href="/"> to my index.html. This is done to get the routing to work though.

What is the best practise here? All my components uses templateUrl and i'm seriously considering inlineing the html instead - which would be really annoying...

I'm using traceur as transpiler.


Solution

  • If anyone is interested, i solved that problem in a two step fix:

    First, in my index.html, where i import my app, before i do that, i initialize a global variable that i use later as a baseUrl:

    if (window.cordova !== undefined) {
        baseLoadpath = 'data/data/dk.app_name/files/download/app_dir/';
    } else {
        baseLoadpath = '/'
    }
    

    Whenever i load a template, i prepend this baseLoadPath like this:

    @View({
        templateUrl : baseLoadpath + 'app.html' 
    })
    

    That takes care of the file paths. I still can't get it up and running in PhoneGap due to other erros...