Angular UI-Router嵌套视图

问题描述：

我试图让嵌套的视图工作，其中登录后将其发送到in.html从那里所有链接链接到ui-view在in.html内。目前，所有链接到一个 “新” 页面Angular UI-Router嵌套视图

的index.html

<!-- more HTML --> 
<body ng-controller="MainController as main"> 
<!--<div id="loading"><span>Loading</span></div>--> 

<div ui-view="default"></div> 
</body> 
<!-- more HTML -->

in.html

<a ui-sref="online">Online Users</a> 
<div ui-view="main"></div>

app.js路线

var $td = $config.TPL_DIR; 

$stateProvider 
    .state('auth', { 
     url: '/auth', 
     views: { 
      "default": { 
       controller: 'AuthController as auth', 
       templateUrl: $td + 'login.html' 
      } 
     } 
    }) 
    .state('loggedin', { 
     url: '/in', 
     views: { 
      "default": { 
       templateUrl: $td + 'in.html' 
      } 
     } 
    }) 
    .state('online', { 
     url: '/online', 
     views: { 
      "main": { 
       controller: 'OnlineController as online', 
       templateUrl: $td + 'online.html' 
      } 
     } 
    });

答

更改状态的loggedIn。在线

.state('loggedin.online', { 
     url: '/online', 
     views: { 
      "main": { 
       controller: 'OnlineController as online', 
       templateUrl: $td + 'online.html' 
      } 
     } 
    });

更改链接

<a ui-sref=".online">Online Users</a> 
<div ui-view="main"></div>

答

试着做一些子视图，然后改变从在那里的用户界面视图。像

.state('loggedin.another_view', { 
    url: '', 
    views: { 
     "main": { 
      templateUrl: $td + 'partial.html' 
     } 
    } 
})

东西由于loggedin是父视图，当路由器查找main，它会寻找的loggedin上下文视图中。它会将partial.html加载到您的视图中。

嘿，已经解决了下面，但谢谢+1 :) – Ian

Angular UI-Router嵌套视图

相关推荐