Angular ui-router и доступ к параметрам дочернего состояния от родительского

Отредактировано с более подробной информацией

Новый вопрос здесь, я уверен. Я пытаюсь сделать что-то, что, по моему мнению, было бы простым, но я никуда не денусь.

В принципе, у меня есть родительское состояние с несколькими дочерними состояниями. Я хочу загрузить некоторые данные в разрешение родительского состояния, чтобы он был доступен для всех дочерних состояний. Для этого мне нужен параметр (контекст), который передается дочернему состоянию. Я получаю его через $state.params. код (некоторые опущены для ясности) выглядит следующим образом:

.state('pbr', {
    url: "/pbr",
    templateUrl: "pbr/pbr.html",
    controller: "pbrBaseCtrl",
    abstract: true ,
    resolve: {
        dpts: function(NavDPT, $state) {
               return NavDPT.query({context: $state.params.context}).$promise;
              }
        }    

})
.state('pbr.review', {
        url: "/review/{context}?div",
        templateUrl: "pbr/pbr-review.html",
        controller: "pbrReviewCtrl"
    })

Из того, что я понимаю, $state.params должен содержать переданные параметры для родительского и дочернего состояний, тогда как $stateParams имеют параметры только для активного состояния.

Во всяком случае, то, что я вижу, заключается в том, что $state.params не заполняется до того, как произойдет разрешение, и, таким образом, выборка данных не удалась. Тем не менее, он все-таки заселен. Кажется, я не могу найти способ дождаться появления $state.params до получения данных. Я пробовал обернуть вещь в тайм-аут и т.д.

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

 .state('pbr', {
            url: "/pbr?newcontext",
            templateUrl: "pbr/pbr.html",
            controller: "pbrBaseCtrl",
            abstract: true ,
            resolve: {
                dptsResource: 'NavDPT',
                dpts: function(dptsResource, $state, $log) {
                    $log.info("state.params is also ",$state.params);
                    return dptsResource.query({context: $state.params.newcontext}).$promise;
                }
            }

        })

Спасибо.

Крис

Ответы

Ответ 1

Существует пример, показывающий, как мы можем использовать функцию $stateParams даже в resolve, но они должны быть определены в текущем или родительское состояние (не в дочернем)

Итак, это состояния:

  $stateProvider
    .state('pbr', {
        // we define 2 params oldContext and newContext
        url: "/pbr/{oldContext}?newContext",
        ...
        resolve: { 
            // here we can get all params defined for our state
            dpts: function($state, $stateParams) { 
                return {
                  oldContext : $stateParams.oldContext,
                  newContext : $stateParams.newContext,
                }
            }
        }
    })
    // child will have even the context as 3rd param
    .state('pbr.review', {
      url: "/review/{context}",
      ...
    })

Вот как их называть:

// via ui-sref
ui-sref="pbr.review({oldContext: 'abc1', newContext : 'def1', context : 'xyz1'})"
ui-sref="pbr.review({oldContext: 'abc2', newContext : 'def2', context : 'xyz2'})"

// via href
href="#/pbr/abc1/review/xyz1?newContext=def1"
href="#/pbr/abc2/review/xyz2?newContext=def2"

Наблюдайте больше в том, что plunker

Ответ 2

Просто определите параметры на родительском уровне. Затем вы получите доступ к ним как на родительском, так и на уровне ребенка.

РОДИТЕЛЕЙ:

{
    state: 'modal',
    config: {
        url: '/modules?person_id&encounter_id',
        controller: 'ModalController',
        controllerAs: 'vm',
        templateUrl: 'app/modal/views/modal.html',
        abstract: true
    }
}

РЕБЕНОК:

{
    state: 'modal.micro',
    config: {
        url: '/micro',
        controller: 'MicroController',
        controllerAs: 'vm',
        templateUrl: 'app/micro/views/micro.html'
    }
}

ДОСТУП ИЗ МОДАЛЬНОГО CTRL (пример):

if (condition) {
    vm.currentPerson = _.find(DashboardModel.pane1Data.DATA_REC.DATA_LIST, function (person) {
        return person.PERSON_ID == $stateParams.person_id;
    });
}

ДОСТУП ОТ ДЕТЕЙ CTRL (пример):

if (condition) {
    vm.currentPerson = _.find(DashboardModel.pane1Data.DATA_REC.DATA_LIST, function (person) {
        return person.PERSON_ID == $stateParams.person_id;
    });
}