AngularJS and ExpressJS routing conflicts

Question

I am trying to pass an index value, for an array, into a route, so I can use the id to load a specific object into a detail view.

Controller that injects the index and changes path

location.path('/detail/'+index);

$routeProvider that handles the detail routing

.when('/detail/:index', { 
    controller: DetailViewCtrl, templateUrl: 'partials/detail' 
});

Express script that handles the partial loading

app.get('/partials/:partial', function(req, res) {
    return res.render('partials/' + req.params['partial']);
};

If I pass in an index of 5 then I expect the URL to look like "localhost:3000/detail/5", and I do get that in my browser but the server returns a 404 error where is was trying to look for some weird URL "localhost:3000/detail/partials/detail." I have no clue where the "detail " that is added before the partial is coming from.

It would be nice to know what is happening behind the scenes and how to fix the problem. How can I pass custom variables in the route and not have express freak out?

Stewie · Accepted Answer · 2013-07-05 17:20:28Z

2

Prepend the templateUrl with /:

.when('/detail/:index', { 
   controller: DetailViewCtrl, 
   templateUrl: '/partials/detail' 
});

or insert the base tag under the HTML head element as in:

<base href="/" />

answered Jul 5, 2013 at 17:20

Stewie

60.4k20 gold badges148 silver badges113 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

AngularJS and ExpressJS routing conflicts

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related