Catch all url route that allows query parameters - angularjs

Question

Using ui-router, is there a way to capture a path that contains forward slashes and query parameters?
Let's say there's the catch-all rule in the state configuration:
var exState = {
url: '/example/*path',
...
};
$stateProvider.state(exState);
and then point my browser to
/example/test1?var1=a&var2=b/test2?var3=c&var4=d/
I now see that the forward slashes get encoded:
test1?var1=a&var2=b%2Ftest2%3Fvar3&var4=d%2F
and $stateParams.path is test1 - not what I wanted. Is it possible to get the actual 'raw' path for further processing while avoiding the automatic query parameter capturing which ui-router is doing here?

Answer 1

You can accomplish this but you'll need to use Regex with your URL state, this is from the UI-Router Guide (https://github.com/angular-ui/ui-router/wiki/URL-Routing):
Regex Parameters
A bonus to using curly brackets is the ability to set a Regular Expression rule for the parameter:
// will only match a contactId of one to eight number characters
url: "/contacts/{contactId:[0-9]{1,8}}"
Examples:
'/user/{id:[^/]*}' - Same as '/user/{id}' from the previous example.
'/user/{id:[0-9a-fA-F]{1,8}}' - Similar to the previous example, but only matches if the id parameter consists of 1 to 8 hex digits.
'/files/{path:.*}' - Matches any URL starting with '/files/' and captures the rest of the path into the parameter 'path'.
'/files/*path' - Ditto. Special syntax for catch all.`
This one should catch your url and the parameter string: '/files/{path:.*}' - Matches any URL starting with '/files/' and captures the rest of the path into the parameter 'path'.
EDIT: After capturing the the rest of the URL in the path parameter you'll need to URL decode in order to regain the / & ? and anything else encoded. You can use decodeURIComponent()