具有多个父状态的Angular-ui-router子状态 [英] Angular-ui-router child state with multiple parent states

问题描述

使用Angular-ui-router，可以定义具有多个父状态的子状态:

Using Angular-ui-router, is there a possibility to define a child-state that has multiple parent states:

$stateProvider
    .state("parent1", {
        url: '/',
        templateUrl: 'parent1.html'
    })
    .state('parent2', {
        url: '/parent2',
        templateUrl: 'parent2.html'
    })

    //Make accessible from every state parent-state
    .state("child", {
        url: 'child',
//TODO  parents: ['parent1', 'parent2']
        onEnter: function() {
            //do something;
        }
    })

示例:

您的Angular应用程序具有一条指令，该指令在您的应用程序中的不同状态下多次使用.该指令本身包含一个链接，该链接重定向到其他状态.根据使用指令的位置，应将其子状态附加到当前活动的父状态.

Your Angular app has a directive that is used multiple times in different states in your app. The directive itself includes a link which redirects to a different state. Depending on where the directive is used, it should append its child-state to the current active parent-state.

为每个排列定义状态，例如 state1.child ， state2.child 等似乎并不正确.需要一种更好的方法.

It just doesn't seem right to define states for each permutation like state1.child, state2.child etc.. There needs to be a better way.

推荐答案

这种层次结构将与DOM树结构背道而驰，根据定义，该树结构不允许多个相同元素的父级.

This kind of hierarchy would go against the DOM tree structure, which by definition doesn't allow multiple parents of same element.

此外，它容易出错(并且令人头疼)，很容易导致

Moreover, it is error (and headache) prone and could easily result in the multiple inheritance diamond problem, as child state do inherit from parent state in some cases.

听起来像是指令，而不是状态，这将是您所需要的更好的解决方案.

It sounds like a directive, and not a state, would be the better solution for what you're looking for.

刚刚发现有一个已解决的问题，已关闭，因为他到达了相同的结论(该指令是更好的方法)

Just saw that there's a closed issue on this, which is closed because he reached the same conclusion (that a directive is the better way)

这篇关于具有多个父状态的Angular-ui-router子状态的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！