Ui-router: default route based on user role

Question

I am using a UI router in my project. The home page of my application consists of 4 tabs, each of which is associated with a different template. This is my current routing code, im using 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 a user logs in, he goes to root.jobs.list.draft. How to redirect to a given state based on the registered user role (Admin, User, Clerk, etc.). If you want to redirect all users in the Engineer or Lead Engineer roles to "root.jobs.list.inprogress"

I originally had this in the controller, but as you can see, it did not work, because every time I clicked on the tab, it always returned back to "root.jobs.list.inprogress"

  if (user !== undefined) { if (user.BusinessRole == "Engineer" || user.BusinessRole == "Lead Engineer") $state.go('root.jobs.list.inprogress'); } 

Answer 1

I already had to solve this:

I registered a state that was used only to process the default page based on the role.

  $urlRouterProvider.otherwise("/"); $stateProvider.state("default", { url:"/", templateUrl: "app/core/home/default.html", controller: "DefaultController" }); 

The controller was simple:

 (function () { "use strict"; angular.module("core").controller("DefaultController", [ "$rootScope", "$state", "roles", function ($rootScope, $state, roles) { if ($rootScope.hasPermission(roles.SomeRoleName)) { $state.go("someStateName"); } else if ($rootScope.hasPermission(roles.SomeRoleName)) { $state.go("someStateName"); } } ]); })(); 

Answer 2

If the link for the default state is the same for each role, for example / user / home for admin and user . One thing we can do is show the various html templates in the default state of the role-based application. ui-router provides the @stateProvider service, which has the properties templateProvider and ControllerProvider. We can use them to determine which template and controller we want to use for the same default state. Here is a link to the documentation.