How about having a single state dashboard with an optional param :verificationCode? When the verificationCode state param is empty, the url will fallback to something like /dashboard. Else it will be /dashboard/<some code here>. For this you also need to define default param values in your state config :
.state('app.dashboard', {
url: '/dashboard/:verificationCode',
controller: 'DashboardController',
templateUrl: 'src/components/app/dashboard/dashboard.html',
params : {
verificationCode : ''
}
});
For transition you can do either $state.go('dashboard') or $state.go('dashboard',{verificationCode : 'abcxyz'}).
I am not sure if this is the best way to achieve something like this in UI Router. I have not done Angular for a year now. Looking forward to seeing what others suggest.
I would also go with this approach using ui-router templateProvider and $templateFactory i.e .state('app.dashboard', {
url: '/dashboard/:verificationCode',
templateProvider: ['$state', '$stateParams', '$templateFactory',
function($state, $stateParams, $templateFactory) {
if($stateParams.verificationCode) {
return $templateFactory.fromUrl('src/components/app/dashboard/dashboard.html');
} else {
return $templateFactory.fromUrl('src/components/app/dashboard/dashboard.html');
}
}]
})