I'm using UI router in my project. The home page of my application consists of 4 tabs, each routing to a different template. This is my current routing code, im using a forEach to create 6 routes.
['Draft','Assigned','InProgress','Completed','Rejected','All'].forEach(function (val) {
$stateProvider.state({
name: 'root.jobs.list.' + val.toLowerCase(),
url: '/' + val.toLowerCase(),
views: {
'currentTab': {
templateUrl: 'adminworkspace/jobs',
controller: 'JobsController'
}
},
data: {
userJobsStatus: val
}
});
});
By default when the user logs in, it goes to "root.jobs.list.draft". How do redirect to a given state based on the logged in user's role (Admin, User, Clerk etc..). If want to redirect all users that are part of the "Engineer" or "Lead Engineer" role to "root.jobs.list.inprogress"
I originally had this in the controller, but as you can see, it didn't work, because each time I clicked on a tab, it always routes back to "root.jobs.list.inprogress"
if (user !== undefined) {
if (user.BusinessRole == "Engineer" || user.BusinessRole == "Lead Engineer")
$state.go('root.jobs.list.inprogress');
}
I already have had to solve that :
I've registered a state that was used only to handle the default page based on the role.
The the controller was simply :
If the link of the default state is same for each role e.g /user/home for both admin and user. One thing we can do is to show different html templates in the default state of the app based on roles. ui-router provides @stateProvider service which has properties templateProvider and ControllerProvider properties. We can use them to figure out which template and controller we want to use for same default state. Here is the documentation link.