AngularJS - 有条件地为路由设置一个控制器

Question

I'm using the native AngularJS router and was wondering if there is a way to assign a controller to a route conditionally. For example, let's say I have three user types:

• Guest
• User
• System Admin

When they come to the home page, I want to be able assign a different controller based on the user type. So I would have three registered controllers: guestHomeCtrl , userHomeCtrl , systemAdminHomeCtrl .

I imagined something like this:

$routeProvider
    .when( '/' , {
        controller: getHomeCtrl(),
        controllerAs: 'homeCtrl'
    })

I know I can just pass in the string of the registered controller, but the main issue is being able to find out what type of user is logged in. I have a userService that typically keeps track of that, but it doesn't seem like I can access it from where I set up the routes. Or am I mistaken?

Any direction would help out a lot.

Answer 1

I would suggest using userService with a single controller. Read through the page below, specifically the resolve argument.

https://docs.angularjs.org/api/ngRoute/provider/ $routeProvider

This blog post also describes how to use the resolve.

http://odetocode.com/blogs/scott/archive/2014/05/20/using-resolve-in-angularjs-routes.aspx

Try sending the specific function or variable you need to the controller. I used userService.User.userAccountStatus , but it really depends on the setup in your service file.

$routeProvider
    .when( '/' , {
        controller: HomeCtrl,
        controllerAs: 'HomeCtrl',
        resolve: { 
          userService: function(userService) {
            return userService.User.userAccountStatus();
          }
        }
    })

I use ngInject for injecting dependencies, but I assume you get the gist of giving services to a controller.

angular
  .module('app')
  .controller('HomeCtrl', HomeCtrl)

  /** @ngInject */
  function HomeCtrl($scope, $log, $state, userService) {
  }

I can provide further examples if you need them.