Javascript 使用ui路由器的某些视图中的角度部分

我正在构建一个普通的应用程序，在处理ui路由器时遇到了问题。我有一个index.html，里面有整个网站的模板，有标题、边栏和我放置的内容。在这个文件中，我还加载了所有必要的javascript，如angular、ui路由器、bootstrap、ocLazyLoad等

每个部分视图都放置在index.html内容中，并带有ui路由器状态。我的ui路由器的配置方式如下：

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

    $stateProvider

        .state('home', {
        url: '/home',
        templateUrl: '../views/home.html',
        resolve: {
            deps: ['$ocLazyLoad', function ($ocLazyLoad) {
                return $ocLazyLoad.load([{
                    name: 'myApp',
                    files: [
                        'js/controllers/homeCtrl.js'
                    ]
                }]);
            }]
        }
    })
});

到目前为止，我已经控制了一切。我的问题是：如何创建一个没有标题和边栏的state login.html，因为如果用户没有登录，除了登录，我不想显示任何选项。如何实现这一目标是最安全和最好的方法

---

提前谢谢。

我的网站与您分享了相同的案例。我所做的是我有两种状态：登录和主页。登录状态将指向登录页面，主页状态将指向home.html。 以下是home.html的示例：

<div id="wrapper" ng-class='{"toggled" : $root.toggle }'>
  <div ng-include="'components/sidebar/sidebar.html'"></div>
  <div ng-include="'components/navbar/navbar.html'"></div>
    <div id="page-content-wrapper">
        <div class="container-fluid">
        <!-- <ui-breadcrumbs displayname-property="data.displayName" abstract-proxy-property="data.proxy" ></ui-breadcrumbs> -->
        <ui-breadcrumbs displayname-property="data.displayName" template-url="components/breadcrumb/uiBreadcrumbs.tpl.html"></ui-breadcrumbs>
            <div ui-view="home"></div>
        </div>
    </div>
</div>

所以所有的状态，用户登录后都应该是孩子的家状态