Несколько конфигурационных блоков в модуле angular

Мне нужно разрешить некоторые зависимости (выборку данных для моих служб и т.д.) в моем приложении до его загрузки. Я хотел бы отделить их, так что у меня есть один блок конфигурации для основного приложения, а затем один или несколько блоков конфигурации для других частей приложения.

В конечном счете, я надеюсь, что он разрешит зависимости для основного приложения, загрузит связанные с ним компоненты, а затем разрешит остальные и загрузит эти части, поэтому он будет немного более отзывчивым при загрузке.

Это то, к чему я пришел до сих пор, но он не разрешает зависимости в первом блоке конфигурации:

angular.module('myApp', ['ui.router', 'kendo.directives'])
  .config(function($stateProvider) {
    $stateProvider
      .state('settings', {
        url: '/',
        views: {
          'mainNav': {
              templateUrl: 'scripts/directives/mainNav/mainNav.html',
              controller: 'mainNavCtrl'
          //etc
          }
        },
        resolve: {
          fetchSettings: function(Settings) {
            return Settings.fetch;
          }
        }
      });
  })
  .config(function ($stateProvider, $urlRouterProvider) {
    $urlRouterProvider.otherwise('/');

    $stateProvider
      .state('otherPart', {
        url: '',
        views: {
          'otherPart': {
            templateUrl: 'views/otherPart.html' 
           //etc
          }
        },
        resolve: {
          fetcherPromise: function(User, MyData) {
            var fns = [
              MyData.fetch,
              User.fetchEntitlements
            ];
            return fetcher.inSerial(fns);
          }
        }
      })
      ;

  });

Я даже на правильном пути?

Ответ 1

Вы должны переместить "остальное" в отдельный модуль:

angular.module('separateModule', ['ui.router', 'kendo.directives'])
      .config(function ($stateProvider, $urlRouterProvider) {
        $urlRouterProvider.otherwise('/');
        $stateProvider
          .state('otherPart', {
            url: '',
            views: {
              'otherPart': {
                templateUrl: 'views/otherPart.html' 
               //etc
              }
            },
            resolve: {
              fetcherPromise: function(User, MyData) {
                var fns = [
                  MyData.fetch,
                  User.fetchEntitlements
                ];
                return fetcher.inSerial(fns);
              }
            }
          })
          ;

      });
angular.module('myApp', ['separateModule', 'ui.router', 'kendo.directives'])
  .config(function($stateProvider) {
    $stateProvider
      .state('settings', {
        url: '/',
        views: {
          'mainNav': {
              templateUrl: 'scripts/directives/mainNav/mainNav.html',
              controller: 'mainNavCtrl'
          //etc
          }
        },
        resolve: {
          fetchSettings: function(Settings) {
            return Settings.fetch;
          }
        }
      });
  });

Если я прав, он не разрешал зависимости для первого блока, потому что он был перезаписан вторым .config.

Вот ваш код для одной конфигурации, если вам это нужно:

angular.module('myApp', ['ui.router', 'kendo.directives'])
.config(function($stateProvider, $urlRouterProvider) {
    $stateProvider
        .state('settings', {
            url: '/',
            views: {
                'mainNav': {
                    templateUrl: 'scripts/directives/mainNav/mainNav.html',
                    controller: 'mainNavCtrl'
                    //etc
                }
            },
            resolve: {
                fetchSettings: function(Settings) {
                    return Settings.fetch;
                }
            }
        })
        .state('otherPart', {
            url: '',
            views: {
                'otherPart': {
                    templateUrl: 'views/otherPart.html' 
                    //etc
                }
            },
            resolve: {
                fetcherPromise: function(User, MyData) {
                    var fns = [
                        MyData.fetch,
                        User.fetchEntitlements
                    ];
                    return fetcher.inSerial(fns);
                }
            }
        });

    $urlRouterProvider.otherwise('/');
});

Ответ 2

Наличие нескольких конфигурационных блоков в приложении не является проблемой. он должен работать нормально. Вполне нормально настраивать конфигураторы, чтобы они были изолированы. должно быть что-то еще, что вам здесь не хватает. Возможно, поставщики услуг не будут разрешены в момент запуска конфигурации приложения.

Или модуль, который имеет сервис в нем, не разрешен во время запуска приложения. Убедитесь, что модуль или службы, которые используются в блоке конфигурации, разрешены и доступны в AppModule при запуске.