如何正确登录页面？

Question

我有以下HTML结构

<% include header.html %>
<% include sidebar.html %>

<div class="robust-content content container-fluid">
  <div class="content-wrapper">
    <div class="content-header row"></div>
    <div class="content-body" ui-view></div>
  </div>
</div>

<% include footer.html %>

我应该首先登录页面，其中只有没有页眉，页脚和侧边栏的第一个安装向导的空白页面。在另一页中，它们存在。

我愿意使用ui.router，但在这种情况下我应该将所有页面都包含在ui-view中。

是否可以将整个页面包装到ui-view中 - 包括页眉和页脚，然后在需要时在每个模板中定义它？

问它，因为想要在某处定义页眉，页脚和侧边栏。然后稍后更改内容。

Answer 1

解决方案

<强> app.js

app.config(function($urlRouterProvider, $stateProvider) {

    $urlRouterProvider.otherwise('/dashboard');
    $stateProvider
    .state('dashboard', {

        templateUrl: './pages/index.html'
    })
    .state('dashboard.home', {

        url: '/dashboard',
        templateUrl: './pages/dashboard.home.state.html'
    })
    .state('setup', {

       url: '/setup',
       templateUrl: './pages/setupwizard/setupwizard.html',
       controller: 'setupWizardController'
    });
});

<强>的index.html

<div id="app" ui-view></div>  

信息页/ index.html中

<div ng-include="'pages/commons/header.html'"></div>
<div ng-include="'pages/commons/sidebar.html'"></div>

<div class="robust-content content container-fluid">
     <div class="content-wrapper">
         <div class="content-header row"></div>
         <div class="content-body" ui-view></div>
     </div>
</div>

<ng-include src="'pages/commons/footer.html'"></ng-include>

信息页/ dashboard.home.state.html

<div class="row">
     <div class="col-lg-12 col-md-12 col-xs-12">
         <div class="widget-holder">

         </div>
     </div>
</div>

如果用户访问仪表板，他将永远不会进入setupWizard（第一次除外），因此标题等会一直加载。