嵌套状态可以用于嵌套视图和并行视图。
只是要注意一些关于嵌套状态的事情。
嵌套状态的好处在于您可以轻松地从父视图共享/继承数据到子视图。
例如:
假设您有一些页面需要用户登录。
$stateProvider
.state('admin', {
url: '/admin'
resolve: { authenticate: authenticate }
})
.state('admin.users', {
url: '/users'
})
function authenticate(Auth) {
if (Auth.isLoggedIn()) {
// Resolve the promise successfully
return $q.when();
} else {
$timeout(function() {
// This code runs after the authentication promise has been rejected.
// Go to the log-in page
$state.go('login', {}, {reload:true});
});
// Reject the authentication promise to prevent the state from loading
return $q.reject();
}
现在,作为 admin 的子状态的每个状态都必须传递authenticate
服务(即使您直接导航到admin/users/
)。
所以基本上在解决方案中你可以放任何东西,所有的子状态都将从那里继承。
至于并行视图,您可以完全控制布局。
@TonyGW的例子很棒
您可以在您的应用程序中同时使用它们,我的意思是嵌套状态和并行视图,您也可以拥有并行嵌套视图。这实际上取决于您的布局布局的结构。
如果您希望子状态出现在父状态的 html 中,则必须使用嵌套视图。