Required parameter is empty string if trailing slash provided

[adamreisnz]

I'm not sure if this is expected behaviour or not, but it seems to me like a bug (in 1.0.0-rc1).

Consider the following state declaration:

$stateProvider.state('verifyEmail', {
    parent: 'portal',
    url: '/email/verify/:token/:optional',
    component: 'verifyEmail',
    params: {
      token: {
        type: 'string',
      },
      optional: {
        value: null,
        squash: true,
      },
    },
  });

Now what happens is that if I browse to /email/verify it results in a 404, because the route is not found due to the missing token parameter. However, browsing to /email/verify/ with a trailing slash, does load the route and the token parameter is an empty string.

I was under the impression that with the above declaration, the token parameter would in fact be mandatory. If there's nothing behind the trailing slash, then the token parameter should be undefined I think and not load the route, rather than being converted to an empty string.

Now I am still required to check if the token parameter is in fact there in my component, or register a transition event handler, which seems redundant.

[christopherthielen]

You make a good point about optional/non-optional path parameters. The path type matches 0 or more characters. I thought it coerced the empty string to undefined (if an empty string is matched) but it doesn't seem to do so. I'll look into it and see if it's a bug.

In the meantime, you can create your own path param type (or even modify the built-in one) so it requires at least one character. Here's a plunker that demonstrates: http://plnkr.co/edit/gMULEkuShIzy3jWhhzZ4?p=preview

app.config(function($uiRouterProvider) {
  let urlService = $uiRouterProvider.urlService;
  
  let pathtype = urlService.config.type('path'); // formerly $urlMatcherFactory.type()
  let pathtype2 = angular.extend({}, pathtype);
  pathtype2.pattern = /[^/]+/; // require one non-slash character
  urlService.config.type('path2', pathtype2);

[worldspawn]

Do you have solution for those of us on 0.4.2? I am seeing the same behaviour. When i use a constraint like int the parameter is required. However nothing else works and the param is provided as an empty string when targeting / on aroute configured like /{someId}.

Using regular expressions doesnt seem to work either. If a value is provided and the value doesn't match the regex the route doesnt match, but when no value is provided it still matches.

[worldspawn]

so on 0.4.2 i did

.config(['$urlMatcherFactoryProvider', function($urlMatcherFactoryProvider) {
        function valToString(val) { console.log('valToString'); return val != null ? val.toString().replace(/(~|\/)/g, function (m) { return {'~':'~~', '/':'~2F'}[m]; }) : val; }
        function valFromString(val) { console.log('valFromString'); return val != null ? val.toString().replace(/(~~|~2F)/g, function (m) { return {'~~':'~', '~2F':'/'}[m]; }) : val; }

        $urlMatcherFactoryProvider.type('required', {
            encode: valToString,
            decode: valFromString,      
            is: function(val) { 
                console.log('is');
                return val == null || !isDefined(val) || typeof val === "string"; },
            pattern: /[^\/]+/
        });
    }])

used

.state('ri.admin.secure.deviceProfiles.detail', {
                url: '/{deviceProfileId:required}',
})

Which had no effect at all :/ None of the defined console output was output.

[adamreisnz]

@worldspawn I would highly recommend upgrading to 1.0.0. The upgrade wasn't that much effort and it's well worth it with the increased flexibility you get.

[worldspawn]

Ok, I thought it was for angular 2 only?

Update, now using 1.0... and the regex is working :)
url: '/{deviceProfileId:[^\/]+}',

Thanks.

[adamreisnz]

Nah, we updated our Angular 1 project with the new ui router.
Great!

[stale]

This issue has been automatically marked as stale because it has not had
recent activity. It will be closed if no further activity occurs.

This does not mean that the issue is invalid. Valid issues
may be reopened.

Thank you for your contributions.