app.config + stateProvider

Question

Я использую ui.router для обработки маршрута моего приложения, в настоящее время мое приложение не работает через пару паролей. На данный момент они входят в app.config, я бы хотел пролить каждую конфигурацию маршрута на основе функции, например, эта функция предназначена для SPA «Promotion», как я могу это сделать, поэтому я не буду clutter мой первоначальный файл app.config js?

$stateProvider 
      .state('promotion', { 
       controller: 'PromotionsController', 
       url: '', 
       views: { 
        "list": { 
         controller: 'PromotionsController', 
         templateUrl: templatesRoot + 'Promotion/promotion-list.html' 
        }, 
        "editor": { template: "Welcome" } 
       } 
      }) 
      .state('promotion-edit', 
       { 
        url: '/edit/{id}', 
        views: { 
         "list": { 
          controller: 'PromotionsController', 
          templateUrl: templatesRoot + 'Promotion/promotion-list.html' 
         }, 
         "editor": { 
          controller: ['$scope', '$stateParams', 'promotionService', function ($scope, $stateParams, promotionService) { 
           $scope.promotion = promotionService.getPromotion($stateParams.id) 
           $scope.savePromotion = function() { 
            // save the promotion 
            promotionService.savePromotion($scope.promotion, function (data, responseHeaders) { 
             if (!data.Success) { 
              toaster.pop({ 
               type: 'error', 
               title: 'Error', 
               body: data.Message, 
               showCloseButton: true 
              }); 
             } else { 
              toaster.pop({ 
               type: 'success', 
               title: "Success", 
               body: "Successfully saved the promotion", 
               showCloseButton: true 
              }); 
             } 
            }); 
           }; 
          }], 
          templateUrl: templatesRoot + 'Promotion/promotion-edit.html' 
         } 
        } 
       } 
      ) 
      .state('promotion-create', 
       { 
        url: '/create', 
        views: { 
         "list": { 
          controller: 'PromotionsController', 
          templateUrl: templatesRoot + 'Promotion/promotion-list.html' 
         }, 
         "editor": { 
          controller: 'PromotionsController', 
          templateUrl: templatesRoot + 'Promotion/promotion-create.html' 
         } 
        } 
       } 
      ) 

Answer 1

Отделите свои маршруты в файлах. Например:

promotion.js

angular.module('AppName').config(['$stateProvider', '$urlRouterProvider', function ($stateProvider, $urlRouterProvider) { 
    $stateProvider.state('promotion', { 
      controller: 'PromotionsController', 
      url: '', 
      views: { 
       "list": { 
        controller: 'PromotionsController', 
        templateUrl: templatesRoot + 'Promotion/promotion-list.html' 
       }, 
       "editor": { template: "Welcome" } 
      } 
     }) 
}]); 

Затем в index.html, ссылаются на этот файл:

<script src="pathToRoutes/promotion.js"></script> 

После того, что вы должны быть хорошо идти.

Answer 2

Просто поместите его в отдельные файлы, содержащие только конфигурационные блоки.

Например, вы можете иметь:

app/scripts/app.js # not router configuration 
app/scripts/routes/promotions.js # pomotions configuration 
app/scripts/routes/featureN.js # n-th feature 
app/scripts/routes/custom-states-provider.js 

Последнее, что вам нужно будет, если вы заметите много дублирования кода между функциями, и вы хотите, чтобы сделать собственную оболочку вокруг пользовательский интерфейс маршрутизатора $ stateProvider с утилитой функции. Конечно, есть и другие решения этой проблемы.