dynamic routing with muiltiple $routeParams AngularJS

dynamic routing with muiltiple $routeParams AngularJS

Using parameters as identifiers to fetch content:
$routeProvider.when('/:category', {
templateUrl: '/views/category.html'
});
But what if I have a second tier?...
$routeProvider.when('/:category/:service', {
templateUrl: '/views/service.html'
});
This works fine for following links with $locationProvider.html5Mode(true)
<a href='/{{items.category}}/{{item.service}}'></a>
However directly invoking a link through address bar
x.com/xCategory/xService does not work.
$routeProvider matches :category before seeing second parameter :service
templateUrl for the /:category route is always taking precedence.
x.com/xCategory/xService will always fetch templateUrl for x.com/xCategory
I'm using nginx rewrite rules so I can fully support pushState:
location / {
try_files $uri /index.html;
}
What is going on here?