CODEWITHSUNDEEP
angularjsdependency-injectionangular-ui-router
BenM
BenM

Reputation: 553

Extending ui-router $stateProvider

I am trying to extend the $stateProvider from ui-router in different parts of an Angular app. I figured that creating the main app then adding modules to it should work - but it does not.

On load I get Error: [$injector:modulerr]

var app = angular.module('app', [
  'ui.router',
  'app.MyModule'
]);

// State provider from original app.js
app.config(function($stateProvider, $urlRouterProvider){

  $urlRouterProvider.otherwise('/');

  $stateProvider

    // INDEX
    .state('index', {
      url: '/',
      templateUrl: '/templates/index.tmpl.html'
    })

});


// States for MyModule -- these are concatenated together by grunt  
angular.module('app.MyModule', ['ui.router']).config(
  ['$stateProvider'], function($stateProvider){

  $stateProvider

    .state('MyModuleStateOne',{
      url: '/MyModuleStateOneURL',
      templateUrl: '/MyModule/MyModule.tmpl.html'
    })

});

Is there anyway to extend $stateProvider so that the files can be concatenated together? I'd rather not define every state in one file?

Upvotes: 1

Views: 1181

Answers (1)

himaja
himaja

Reputation: 216

There is an error in the above code, It should be

angular.module('app.MyModule', ['ui.router'])
.config(['$stateProvider', function($stateProvider){
    $stateProvider
    .state('MyModuleStateOne',{
        url: '/MyModuleStateOneURL',
        templateUrl: '/MyModule/MyModule.tmpl.html'
    });
}]);

The parameters should be passed as an array to the angular's config method. Look into this plunker. I used the same code that you have provided.

Upvotes: 1

Related Questions