使用现有导航在AngularJs中实现身份验证

时间:2019-02-01 06:27:03

标签: angularjs routing header navigation

我正在构建一个用于实现用户登录过程的应用程序,但是问题是我的导航代码写在索引页面上。我对如何安排所有事情感到困惑。 因为如果删除导航并将其切换到另一个文件,那么我将失去对某些代码的控制。 为了更好地理解,下面是一些图片,我想做什么。

enter image description here

我想实现这种结构,我无法做到这一点。

Here is my code :
"Side Navbar"
    <nav id="sidebar">
                <div class="sidebar-header">
                    <h3>AltSpace</h3>
                </div>

                <ul class="list-unstyled components">
                    <li><a data-toggle="tab" ui-sref="dashboard">Summary</a></li>
                    <li><a data-toggle="tab" ui-sref="inventory">Inventory</a></li>
                    <li><a ui-sref="">Offers</a></li>
                    <li><a ui-sref="create-admin">Create Admin</a></li>
                </ul>
            </nav>
"Top Navbar" 

    <nav class="navbar navbar-inverse navbar-fixed-top" id='side-nav' style="display:none;">
                        <div class="container-fluid">
                          <div class="navbar-header">
                            <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#myNavbar">
                              <span class="icon-bar"></span>
                              <span class="icon-bar"></span>
                              <span class="icon-bar"></span>
                            </button>
                            <!-- <a class="navbar-brand" href="#">WebSiteName</a> -->
                          </div>
                          <div class="collapse navbar-collapse" id="myNavbar">
                            <ul class="nav navbar-nav">
                              <li class="active"><a href="">Home</a></li>
                              <li><a href="">Page 2</a></li>
                              <li><a href="">Page 3</a></li>
                            </ul>
                          </div>
                        </div>
                      </nav>
"View"

    <div ui-view="mainContent" style="margin-top:5%;"></div>

0 个答案:

没有答案