angularjs – Angular UI路由器 – 父级中的访问状态参数

栏目: JavaScript · 发布时间: 7年前

内容简介:http://stackoverflow.com/questions/22946983/angular-ui-router-access-state-params-in-parent

我有一个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: {
            'concern-instance@': {
                /* some different resolved variables */
            },
        }
    })

这一切都像黄油一样工作.但是在我的task_list模板中,在状态project.task中,我想要能够访问taskId参数,所以我可以突出显示活动的导航链接,即使url是#/ project / 123 / task / 456 / taskId是空的.我明白这是因为模板只能访问为该状态声明的参数.所以如果我想在project.task状态下获取taskId,该怎么办?我需要在porject.task中重新声明任务列表吗?

任何帮助非常感谢.

在UI-Router文档 here

中,他们解释说

“the $stateParams object will only contain the params that were  registered with that state.”

您只能使用父级的resolve属性访问子状态中的父状态参数.

把它放在你的’项目’状态(父):

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

然后在您的控制器内为您的状态“project.task”(子),您应该可以访问这两个

$stateParams.projectId

$stateParams.taskId

http://stackoverflow.com/questions/22946983/angular-ui-router-access-state-params-in-parent


以上就是本文的全部内容,希望本文的内容对大家的学习或者工作能带来一定的帮助,也希望大家多多支持 码农网

查看所有标签

本站部分资源来源于网络,本站转载出于传递更多信息之目的,版权归原作者或者来源机构所有,如转载稿涉及版权问题,请联系我们

深度学习轻松学

深度学习轻松学

冯超 / 电子工业出版社 / 2017-7 / 79.00

《深度学习轻松学:核心算法与视觉实践》介绍了深度学习基本算法和视觉领域的应用实例。书中以轻松直白的语言,生动详细地介绍了深层模型相关的基础知识,并深入剖析了算法的原理与本质。同时,书中还配有大量案例与源码,帮助读者切实体会深度学习的核心思想和精妙之处。除此之外,书中还介绍了深度学习在视觉领域的应用,从原理层面揭示其思路思想,帮助读者在此领域中夯实技术基础。 《深度学习轻松学:核心算法与视觉实......一起来看看 《深度学习轻松学》 这本书的介绍吧!

在线进制转换器
在线进制转换器

各进制数互转换器

Markdown 在线编辑器
Markdown 在线编辑器

Markdown 在线编辑器

HEX HSV 转换工具
HEX HSV 转换工具

HEX HSV 互换工具