Mazzy Mazzy - 2 months ago 11
Javascript Question

how to call a ui-router state declared in another angular module

I have created two angularjs module of the same application. How can I call from the module A the state x declared in the module B? Do you have any idea or workaround?

when I call the state

in this way


from the module A, it isn't found

// This is your parent module

var app = angular.module('app', [
        // Application modules

// This is your child module 1    
var moduleA = angular.module('moduleA', ['ui.router']);

moduleA.config(['$stateProvider', function($stateProvider) {

                .state('moduleA', {
                    url: '/route1',
                    controller: 'moduleAController',
                    template: "<div>Test</div>"

// This is your child module 2     
var moduleB = angular.module('moduleB', ['ui.router']);

moduleB.config(['$stateProvider', function($stateProvider) {

                .state('moduleB', {
                    url: '/route2',
                    controller: 'moduleBController',
                    template: "<div>Test</div>"

Explanation - With this you have one parent module with 2 child modules. Child modules services, controllers and directives can be used across these 3 modules without any dependency injection.