用于没有嵌套的子状态的UI路由器

您可以使用Angular UI路由器来描述页面未嵌套的页面层次结构吗？用于没有嵌套的子状态的UI路由器

背景：

我开发与形成层次清晰〜10个单独的页面一个小的web应用程序（即控制板 - >学生X - >运动Ÿ - >尝试Z）。我希望能够在代码中表达这个层次结构，这样我就可以获得简单的路径和一个保存页面状态的后退按钮（而不是重新加载）。该项目已经为一些子视图使用了UI路由器，所以在这个层次上构建这个层次似乎也是合乎逻辑的。

然而，我碰到的问题是这样的：ui-router将一个子状态加载到一个ui-view内部父状态，而我希望它加载到父母所在的同一个ui-view标记中，父母的INSTEAD。

我的理想的解决方案将涉及我只能够写一个额外的参数replace-parent的状态描述如

.state('student.profile', { 
    url: '/profile', 
    templateUrl: 'views/profile.html', 
    controller: 'ProfileCtrl', 
    replace-parent: true 
    })

然后将更换UI的观点，即“学生”的状态被装载到加载状态时的配置文件页面（并且在卸载子状态时再次返回）。

任何人都可以想出一个方法来实现粗略的这个结果与合理的手段？我能想到的最好的情况是倾听$ stateChange事件，然后全能地牺牲一些山羊到JQuery，但我真的希望有一个非常好的做法。

来源

2014-03-27 velochy

我只是遇到了类似的问题，我想表达一个进度跟踪器的层次结构。似乎没有嵌套视图，UI路由器不支持嵌套状态。

我倾向于解决这个问题是这样的：

.state('student', { 
    url: '/student', 
    templateUrl: 'views/student.html', 
    controller: 'StudentCtrl' 
})  
.state('studentProfile', { 
    url: '/student/profile', 
    templateUrl: 'views/profile.html', 
    controller: 'ProfileCtrl' 
})

注意，状态保持平稳，但URL有一个层次。通过这种方式，不需要视图嵌套，但它需要您在breadcrumb指令/代码中添加更多工作。

我仍然在寻找更好的解决方案。

来源

2014-04-09 10:13:02 martinoss

是的。我基本上结束了实施相同的解决方法... – velochy

你能找到另一种解决方案吗？ – maxtorzito

这个怎么样？ http://stackoverflow.com/questions/24333625/ui-router-sref-to-grandchild-with-parameter-in-child – maxtorzito

用于没有嵌套的子状态的UI路由器

回答

相关问题