Angular 1 UI-Router - HTML5 Mode param URL to always end with a forward slash

243 Views Asked by At

I've got a page that has a base URL of /foo/ and have set up my state to expect a param.

So, if the user hits /foo/user1/, user1 is the param.

Is it possible to watch for both types of urls? For example, can I declare /foo/user1/ and /foo/user1 (notice, there's no forward slash) in the same state or do I need to create another state to specifically watch for the trailing slash?

Currently, it can be one or the other, but not both. Is that an accurate statement, or am I missing something in the documentation?

1

There are 1 best solutions below

1
On BEST ANSWER

if you are using latest version of ui-router add this in your config block $urlMatcherFactoryProvider.strictMode(false) but for older versions of ui-router add this code

$urlRouterProvider.rule(function ($injector, $location) {
    var path = $location.url();

    // check to see if the path already has a slash where it should be
    if (path[path.length - 1] === '/' || path.indexOf('/?') > -1) {
        return;
    }

    if (path.indexOf('?') > -1) {
        return path.replace('?', '/?');
    }

    return path + '/';
});

you should checkout their FAQ area, there is a dedicated section for trailing slash