Angular UI-маршрутизатор - параметры состояния доступа в родительском

У меня есть приложение Angular, использующее большой ui-маршрутизатор.

Моя настройка выглядит так:

.config( function ($stateProvider, $urlRouterProvider) {

    $stateProvider

    // PROJECT DETAIL
    .state('project', {
        url: '/project/:projectId/',
        resolve: {
            /* some base api calls */
        },
        views: {
            'task-list': {
                templateUrl: 'partials/task_list.tmpl.html',
                controller: 'TaskListCtrl',
                resolve: {
                    tasks: function ($stateParams, ConcernService) {
                        return ConcernService.get('project-tasks/', $stateParams.projectId);
                    },
                }
            },
            'concern-instance': {
                /* some resolved variables */
            }
        }
    })
    .state('project.task', {
        url: 'task/:taskId/',
        views: {
            '[email protected]': {
                /* some different resolved variables */
            },
        }
    })

Все это работает как масло. Однако в моем шаблоне task_list, когда в состоянии project.task, я хочу иметь доступ к параметру taskId, чтобы я мог выделить активные ссылки навигации, даже когда URL-адрес #/project/123/task/456/ taskId пуст. Я понимаю, что это потому, что шаблоны имеют доступ только к параметрам, объявленным для этого состояния. Итак, если я хочу получить taskId в состоянии project.task, как мне это сделать? Должен ли я повторно объявить task-list в porject.task?

Любая помощь очень ценится.

Ответы

Ответ 1

В документации UI-Router здесь они объясняют, что

"объект $stateParams будет содержать только те параметры, которые были зарегистрированный в этом состоянии.

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

Поместите это в состояние 'project' (родительский):

...    
resolve: {
    // Expose projectId parameter to child states
    projectId: ['$stateParams', function ($stateParams) {
        return $stateParams.projectId;
    }]
},

Затем внутри вашего контроллера для вашего состояния 'project.task' (дочерний элемент) вы должны иметь доступ к

$stateParams.projectId

и

$stateParams.taskId

Ответ 2

Я заметил, что $state.params содержит параметры дочернего состояния. Кажется, не может найти никакой документации. Он просто работает

Ответ 3

Как вы пытаетесь получить доступ к taskId? Это должно быть так, взято из официальной документации:

$stateProvider
    .state('contacts.detail', {
        url: "/contacts/:contactId",
        templateUrl: 'contacts.detail.html',
        controller: function ($stateParams) {
            // If we got here from a url of /contacts/42
            expect($stateParams).toBe({contactId: 42});
        }
    })