如何使用angular.js默认选择局部视图页面

Question

我有一个问题。我有一个登录页面。当用户登录时，主页即将到来。在该主页中，我有一些选项可以调用其各自的部分视图页面。让我先解释一下我的代码。 / p>

  

user.html：

<nav class="navbar navbar-default navbar-fixed-top"  
     style="margin-top:50px;z-index:111!important;">
<div class="container" style="width:1270px;">
div class="navbar-header navbar-brand">
{{deptName}}
</div>
<div id="navbar" class="navbar-collapse collapse">
<ul class="nav navbar-nav">
<li ui-sref-active="active"><a ui-sref="user">Home</a></li>
<li ui-sref-active="active"><a ui-sref=".plan">Plan</a></li>
<li ui-sref-active="active"><a ui-sref="#">Subject</a></li>
<!-- <li ui-sref-active="active"><a ui-sref=".hod">HOD</a></li> -->
<li ui-sref-active="active"><a ui-sref="#">User Management</a></li>
<li ui-sref-active="active"><a ui-sref="#">User Role</a></li>
<li ui-sref-active="active"><a ui-sref="#">Time Table</a></li>
<li ui-sref-active="active"><a ui-sref="#">Faculty</a></li>
<li ui-sref-active="active"><a ui-sref="#">WDS</a></li>
</ul>
</div><!--/.nav-collapse -->
</div>
</nav>
 <!--main_heading_div-->
<!--middle_content_details_data-->
<div class="row" style="padding-top:120px;"  ui-view>

</div>

登录后，上面的页面即将到来。检查我的下面路由路径：

.state('user',{
        url: '/user',
        templateUrl: 'userview/user.html',
        controller: 'userController'
    })
    .state('user.plan',{
        url: '/plan',
        templateUrl: 'userview/plan.html',
        controller: 'planController'
    })
    .state('user.profile',{
        url: '/profile',
        templateUrl: 'userview/profile.html',
        controller: 'userProfileController'
    })

我需要在用户登录后plan.html默认设置ui-view user.html内的{{1}}。

Answer 1

好吧，这似乎是“默认重定向问题”。还有解决方案，这是我最喜欢的解决方案：

Redirect a state to default substate with UI-Router in AngularJS

我们可以使用默认重定向目标标记任何状态：

.state('user',{
    url: '/user',
    templateUrl: 'userview/user.html',
    controller: 'userController',
    // here is new marker
    redirectTo: 'user.plan'
})

通过这个小代码片段，它将开始发挥魔力：

app.run(['$rootScope', '$state', function($rootScope, $state) {

    $rootScope.$on('$stateChangeStart', function(evt, to, params) {
      if (to.redirectTo) {
        evt.preventDefault();
        $state.go(to.redirectTo, params)
      }
    });
}]);

有even working example