CODEWITHSUNDEEP
javascriptangularjsnode.jsngrouteangularjs-ng-route
ekta
ekta

Reputation: 67

Angular Route for sub folder gives error

I have written 2 ng-app in one project, one is user and the other admin. To remove the # from the url I had used the below code in both app.config function

$locationProvider.html5Mode(true);

and in app/index.html

<base href="/">

and in app/admin/index.html

<base href="/admin/">

user app.js

app.config(['$routeProvider','$locationProvider',
    function($routeProvider, $locationProvider) {
        $routeProvider.
        when('/properties', {
            templateUrl: 'views/modules/properties.html'
        })
        .when('/pages', {
            templateUrl: 'views/pages/pages.html'
        })
        .when('pages/editpages', {
            templateUrl: 'views/pages/editPages.html',
            controller: 'editPagesController',
        });

        $locationProvider.html5Mode(true);
    }
]);

server.js

app.use('/', express.static('app', { redirect: false }));

app.get('/*', function(req, res){
    res.sendFile(__dirname + '/app/index.html');
});

I'm getting the following error, if there's an extra param in the route

Uncaught SyntaxError: Unexpected token <

enter image description here

The above error I get when my urls are

http://localhost:8080/properties/
http://localhost:8080/properties/something
http://localhost:8080/pages/
http://localhost:8080/pages/editpages

This works fine if the url is used without the last / i.e.

http://localhost:8080/properties
http://localhost:8080/pages

I have refered to this questions too but couldn't resolve the issue

Node / Angular app Uncaught SyntaxError: Unexpected token <

How to use multiple index pages in angular

Upvotes: 3

Views: 638

Answers (2)

ekta
ekta

Reputation: 67

Solution found

The placement of the <base href="/"> was just before the </head> before which there were all scripts and links tags. After adding the <base href="/"> after title tag the issue was resolved

Upvotes: 2

Akinjide
Akinjide

Reputation: 2753

The problem is with the express middleware, take for example 

app.use(express.static('./build/'));
// Any invalid calls for templateUrls are under app/* and should return 404
app.use('/app/*', function(req, res, next) {
  four0four.send404(req, res);
});
// Any deep link calls should return index.html
app.use('/*', express.static('./build/index.html'));

Upvotes: 1

Related Questions