Failed To Load Template Issue

Question

Using AngularJS-1.6.5 & Angular-ui-router-1.0.6 && Gulp-3.9.1

I'm having this absolutely annoying issue. I have an angular app that seems to build fine but when I run gulp-connect to run it, I keep getting failed to load template errors in this order:

vendor.js:14803 Error: [$compile:tpload] Failed to load template: app/auth/views/login.tpl.html (HTTP status: undefined undefined)
vendor.js:34081 Transition Rejection($id: 0 type: 6, message: The transition errored, detail: Error: [$compile:tpload] Failed to load template: app/auth/views/login.tpl.html (HTTP status: undefined undefined)
Error: [$compile:tpload] Failed to load template: app/auth/views/login.tpl.html (HTTP status: undefined undefined)

If I run my gulp build process and then use something like httpster to provide the server, the page comes up fine with no error. However, when I add gulp-connect to my build process:

gulp.task("connect",["css", "vendor", "js", "watch", "webWorkers"], function 
 () {
 connect.server({
port: 8888
}); 
});

I get the errors above.

This was working just a day ago and for whatever reason, even previous versions that worked are no longer working either. I've tried redirecting to another template, verified that all entries are in template cache, tried retrieving a file that was on network instead of the template cache, uninstall/reinstalling gulp-connect and nothing has worked. I'm just completely stumped at this point and need to figure something out soon for the sake of my sanity.

Any thoughts would be greatly appreciated.

score 7 · Accepted Answer · answered Aug 16 '17 at 00:21

7

Goodness. After a bunch of trial and error, I finally figured out the issue. The issue was actually with an http interceptor that I was configuring with a token that was retrieved from local storage. The token retrieved from local storage was corrupt or invalid in some way (havent figured this issue out yet) and it was silently erroring out without bubbling the error up.

I wrapped the local storage read method in a try catch and now the templates are loading again.

Man I wasted so much time on this, hopefully this helps someone else out.

answered Aug 16 '17 at 00:21

JakeHova

1,189
2
15
36

I am getting the same error, i am not using localstorage. any leads would be helpful. thanks – NeiL Jan 01 '18 at 13:19
Fr the love of god I did the same. 4h later of configuring server, app, and God knows what, in a mad rage, I cped error with words angularjs and got to this. SO MUCH RAGE. Worst error propagation EVER! – DanteTheSmith May 17 '18 at 19:22

score 1 · Answer 2 · answered Nov 17 '17 at 08:41

In my case, it it was a missed return config; statement when I add an interceptor to my app.

app.factory('loadingInterceptor', [
'$rootScope',
function ($rootScope)
{

    return {
        request: function (config)
        {
            var loadingEl = $(".loading-element");
            if (loadingEl)
            {
                showLoading(loadingEl, true);
            }
            // return config; 
        },
        response: function (response)
        {
            var loadingEl = $(".loading-element");
            if (loadingEl) {
                showLoading(loadingEl, false);
            }
        }
    };
}

]);

hope this will help someone.

score 1 · Answer 3 · answered Oct 26 '18 at 20:14

This also got me going for a while. In my case it was adding my view to the anonymousEndpoints config section.

anonymousEndpoints: ['clientapp/modules/login/login.view.html'],

adalProvider.init({
            instance: 'https://*.microsoftonline.com/',
            tenant: '*.onmicrosoft.com',
            clientId: 'Some-long-guid',
            anonymousEndpoints: ['clientapp/modules/login/login.view.html'],
            extraQueryParameter: 'nux=1',
    },$httpProvider);

Hope it helps someone down the road.

Failed To Load Template Issue

3 Answers3