angular ui-router dot in url query parameter angular

Question

As something that I cannot control, I get a query string with certain parameters. In my htaccess file, I rewrite that query string to place those parameters in a URL and separate them with slashes. The problem is that one of those parameters contains dots which is giving me problems.

I would like to fix this in the angular router, but I cannot seem to the ui-router to work with it. Here is what I have now ...

$stateProvider.state('app.connect', {
    url      : '/Connects/{path:.*}',
    views    : {
        'content@app': {
            templateUrl: 'app/main/apps/connect/connect.html',
            controller : 'ConnectController as vm'
        }
    },
    bodyClass: 'connect'
});

I have also tried

url : '/Connects/{path:[a-zA-Z0-9\%\.]+}',

This does not work. Any suggestions?

Note that there is a similar question here but this question dealt with a grunt fix and is not relative. I would like the dot to remain in the URL and for the ui-router to recognize it.