В AngularJS - маршрутизатор пользовательский интерфейс - программно добавить Штатов


есть ли способ программно добавлять состояния в $stateProvider после настройки модуля, например, в сервисе ?

чтобы добавить больше контекста к этому вопросу, у меня есть ситуация, когда я могу пойти с двумя подходами:

  1. попробуйте принудительно перезагрузить состояние, определенное в конфигурации модуля, проблема в том, что состояние имеет reloadOnSearch значение ложные, поэтому, когда я пытаюсь $state. go('state.name', {new:param}, {reload: true}); ничего не происходит, есть идеи ?

государство определение

.state('index.resource.view', {
  url: "/:resourceName/view?pageNumber&pageSize&orderBy&search",
  templateUrl: "/resourceAdministration/views/view.html",
  controller: "resourceViewCtrl",
  reloadOnSearch: false,
})
  1. попробуйте программно добавить состояния, которые мне нужно загрузить из службы, чтобы маршрутизация могла работать правильно. Я бы предпочел пойти с первым вариантом, если это возможно.
3 52

3 ответа:

см. - изменить-для получения обновленной информации

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

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

// config-time dependencies can be injected here at .provider() declaration
myapp.provider('runtimeStates', function runtimeStates($stateProvider) {
  // runtime dependencies for the service can be injected here, at the provider.$get() function.
  this.$get = function($q, $timeout, $state) { // for example
    return { 
      addState: function(name, state) { 
        $stateProvider.state(name, state);
      }
    }
  }
});

я реализовал некоторые вещи называют Будущее Государства in ui-Router Extras которые заботятся о некоторых угловых случаях для вас, как отображение URL-адресов в состояния, которые еще не существуют. Будущие состояния также показывают, как вы можете лениво загружать исходный код для состояний времени выполнения. Взгляните на исходный код чтобы почувствовать, что участвует.

- edit-for UI-Router 1.0+

в UI-Router 1.0 состояния могут быть зарегистрированы и сняты с учета во время выполнения с помощью StateRegistry.register и StateRegistry.deregister.

чтобы получить доступ к StateRegistry, введите его как $stateRegistry, или впрыснуть $uiRouter и доступ к нему через UIRouter.stateRegistry.

UI-Router 1.0 также включает в себя будущие состояния из коробки, которая обрабатывает ленивую загрузку определений состояний, даже синхронизацию по URL.

Крис Т прибил его! Поставщик-это путь. Вам не нужно шлепать его на объект окна, заставку, более защищенный и т. д.

перекрестные ссылки на его ответ с этой статьей действительно помогли: http://blog.xebia.com/2013/09/01/differences-between-providers-in-angularjs/#provider

решение делает определенные модули $stateProvider во время блока конфигурации доступными для других модулей во время их блоков запуска.

в моей ситуации Я динамически генерирую состояния панели мониторинга в зависимости от разрешений пользователя.

во время моего блока конфигурации устанавливается мой провайдер, передавая stateProvider модуля (для доступа позже).

//in dashboard.module.js

var dashboardModule = angular.module('app.modules.dashboard',[
        'app.modules.dashboard.controllers',
        'app.modules.dashboard.services',
        'app.modules.dashboard.presentations.mileage'
    ])

    .provider('$dashboardState', function($stateProvider){
        this.$get = function(PATHS, $state){
            return {
                addState: function(title, controllerAs, templatePrefix) {
                    $stateProvider.state('dashboard.' + title, {
                        url: '/' + title,
                        views: {
                            'dashboardModule@dashboard': {
                                templateUrl: PATHS.DASHBOARD + (templatePrefix ? templatePrefix + '/' : '/') + title + '/' + title + '.view.html',
                                controller: controllerAs ? controllerAs : null
                            }
                        }
                    });
                }
            }
        }
    });

это сделает мой поставщик состояния панели мониторинга доступным для других модулей, вместо того, чтобы хлопать его по окну.

затем в блоке запуска моего пользовательского модуля (контроллер) я могу получить доступ к поставщику состояния панели мониторинга и ввести состояния динамично.

var UserControllers = angular.module('app.modules.user.controllers', [])

.controller("UserLoginController", ["$state", "$dashboardState", function($state, $dashboardState){

    $dashboardState.addState('faq', null, 'content');

    $state.go('dashboard.faq');

}]);

Да, это можно сделать, но поскольку есть слои кэширования, это сложно. Алекс Файнберг задокументировал решение в своем блоге здесь:

http://alexfeinberg.wordpress.com/2014/03/08/dynamically-populating-angular-ui-router-states-from-a-service/

в конце статьи приведен пример создания состояния с помощью stateProvider:

app.stateProvider.state(ent.lob.name.toLowerCase(), {
    url: '/' + ent.lob.name.toLowerCase(),
    controller: ent.lob.name.toLowerCase() + 'Controller',
    templateUrl: 'lobs/views/' + ent.lob.name.toLowerCase() + '.html'
});