CODEWITHSUNDEEP
angularjsangular-ui-router
G. Deward
G. Deward

Reputation: 1592

Dynamic optional ui.router $stateParams?

Is it possible to have dynamic ui.router $stateParams parameters? IF a user supplies parameters on the route, I simply want to address them by name or ordinal position. However, I don't want to define them on every single state.

Something like this...

.state('selector', {
    url: '/select/:brandId/:userId/:appId/:appVerId/:featureId/:dialogId/:controlId/:token',
    template: null,
    controller: 'Selector',
    params: {
        brandId     : { squash: true, value: null },
        userId      : { squash: true, value: null },
        appId       : { squash: true, value: null },
        appVerId    : { squash: true, value: null },
        featureId   : { squash: true, value: null },
        dialogId    : { squash: true, value: null },
        controlId   : { squash: true, value: null },
        token       : { squash: true, value: null }
    }
})

... or this ...

.state('selector', {
    url: '/select/:a/:b/:c/:d/:e/:f/:g/:h',
    template: null,
    controller: 'Selector',
    params: {
        a : { squash: true, value: null },
        b : { squash: true, value: null },
        c : { squash: true, value: null },
        d : { squash: true, value: null },
        e : { squash: true, value: null },
        f : { squash: true, value: null },
        g : { squash: true, value: null },
        h : { squash: true, value: null }
    }
})

I would like to access them by name or with the ordinal position...

var a = $stateParams.a; // or
var b = $stateParams[1];

This would allow the following URLs to be valid:

http://adsf.com/selector  
http://adsf.com/selector/////217H3  
http://adsf.com/selector/23AD/12D///217H3

Upvotes: 0

Views: 780

Answers (1)

Fred Lackey
Fred Lackey

Reputation: 2391

I already answered this for you on another thread five months prior to you asking this one...

Angular UI-Router more Optional Parameters in one State

Short answer....

.state('login', {
    url: '/login/:a/:b/:c/:d',
    templateUrl: 'views/login.html',
    controller: 'LoginCtrl',
    params: {
        a: { squash: true, value: null },
        b: { squash: true, value: null },
        c: { squash: true, value: null },
        d: { squash: true, value: null },
    }
})

Upvotes: 1

Related Questions