Q:

Is it possible to let submodules in AngularJS control their own routing using ui-router?

Here's the scenario:
I have a main AngularJS app that uses ui-router for routing, like any other app. I also have a smaller AngularJS module that functions as its own app, not requiring that it be a submodule of my larger app. 
I would like for the smaller app to handle its own routing and templating, too. Goal here being, the mini app can be loaded by another AngularJS app, or loaded on its own, and have all its routing and templates set up already.
Main App:
  angular
    .module('mainApp')
    .config(['$stateProvider', function($stateProvider) {
      $stateProvider
        .state('mainAppParent', {
          url: '/',
          templateUrl: 'main.html',
          controller: 'mainCtrl',
          controllerAs: 'vm'
        })
        .state('mainAppParent.miniJournalApp', {
          url: '/journal'
        });
     }]);

Mini App:
  angular
    .module('miniJournalApp')
    .config(['$stateProvider', function($stateProvider) {
      $stateProvider
        .state('mainJournalState', {
          url: '/',
          templateUrl: 'mainJournalView.html',
          controller: 'JournalCtrl',
          controllerAs: 'vm'
        })
        .state('newEntry', {
          url: '/new'
        });
     }]);

I'm planning on having all the components of the mini app being an AngularJS .component(), so I'm wondering if the correct way to do this is to just let the parent app handle routing, and let the mini app handle the templates when I define each component/directive. Then, when I want to load the mini app on its own, I would just write a wrapper AngularJS module with new routing. 

A:

As we can see that in angular ui router we are using $stateProvider so basically we are using a provider.
In an angular app the provider is loaded once and then angular puts the instance in cache so next time when the provider is injected somewhere then same instance is used.
As same instance of $stateProvider is used across angular app so it is perfectly fine to define separate states for submodules.
And this is a good practice for code maintenance.
I have used it in many projects

