One of the problems I’d previously had while developing a rather complex mobile app with the Angular-UI-Router was that the state.config file got pretty gnarly with more than a few abstract and nested states.

In the process of looking for a different solution, I came across a merge note that mentioned there’s now a way to use modular state.config files.

“Note: You still need to manage module dependencies.”

I don’t see a clear path to using this pattern & the BaseState class constructor pattern, but I still think we should convert to the modular version.

I suggest something like this:


angular.module('states', [
    .config(function($stateProvider) {
        $stateProvider.state('state', {...})


angular.module('feature1', []).config(function($stateProvider) {
       $stateProvider.state('feature1.state0', {...})
       $stateProvider.state('feature1.state1', {...})
       $stateProvider.state('feature1.state2', {...})