我尝试使用AngularJS和UI路由器构建嵌套视图。解决方案应该有多个步骤,具有不同的问题。第一步是导致不同向导的菜单(每个向导有3个或更多步骤)。问题是启动向导后菜单应该消失。
到目前为止:
JSONParser jsonParser = new JSONParser();
我现在处理观点的方式:
index.html中的我只是将导航添加到视图中,因此在加载第一步时它会消失。 Ui-sref设置为加载不同的"向导"
的初始状态.config(['$stateProvider', '$urlRouterProvider',
function ($stateProvider, $urlRouterProvider) {
$stateProvider
.state("personal-life", {
url:'/personal-life',
controller:"PersonalCtrl",
templateUrl: 'views/personal.html'
})
.state("personal-life.step2",{
url:'/step2',
controller: "PersonalCtrl",
templateUrl:'views/personal-life/step2.html'
})
.state("personal-life.step2.step3"**,{
url:'/step3',
controller: "PersonalCtrl",
templateUrl:'views/personal-life/step3.html'
})
.state("career", {
url:'/career',
controller:"CareerCtrl",
templateUrl: 'views/career.html'
})
.state("career.step2",{
url:'/step2',
controller: "CareerCtrl",
templateUrl:'views/career/step2.html'
})
.state("career.step2.step3",{
url:'/step3',
controller: "CareerCtrl",
templateUrl:'views/career/step3.html'
})
}])
用户选择" ui-sref ="个人生活"后加载的文件是 personal.html:
<div ui-view>
<ul>
<li><a ui-sref="personal-life">Personal</a></li>
<li><a ui-sref="career">Career</a></li>
</ul>
</div>
此时我还将第一步的内容嵌套到ui-view中(这允许我自动加载第一步,然后在同一区域内加载后续步骤)。
代码的下一部分:
<div ui-view>
<div class="row">
<div class="small-12 columns">
<h1>Step 1 / 3</h1>
</div>
</div>
<div class="row">
<div class="small-12 columns">
<a ui-sref=".step2" class="small button secondary>Next</a>
</div>
</div>
</div>
这是我遇到问题的地方..我无法&#34;目标&#34;第三步。通过将第一步内容放入ui-view或第三步的ui-sref链接中,我是如何构建整个解决方案的问题? 是否有更好的方法在UI路由器中实现类似的解决方案?
非常感谢任何帮助......