首页 > 解决方案 > 如何以角度在行的下一列中打开routerLink?

问题描述

我正在创建一个仪表板,并使用引导网格创建了侧边栏菜单。现在,当我单击任何侧边栏菜单的 routerLink 时,我想要。我的目标是在该行的下一列中打开该链接,这通常发生在仪表板/管理面板中。但就我而言,当我单击链接时,它会转到下一页。

<div class="row">
<div class="col-sm-2">
<div class="list-group">
     <a routerLink="dashboard" class="list-group-item active"> Dashboard</a>
        <div>
           <a class = "list-group-item" data-toggle="collapse" 
                  href="#collapse1">Accessories</a>

          <div id="collapse1" class="panel-collapse collapse bgColor">
             <div class="list-group">
      <a routerLink ="add-new" class="list-group-item">Add new Accessory</a>
      <a routerLink ="view-accessories" class="list-group-item">View Accessories</a>

          </div>
        </div>
      </div>
    </div>
   </div>
<div class="col">

</div>
</div>


I expect the output that link should be open in next column of row.
but here in my case it goes to next page. how to resove this.[enter image description here][1]


  [1]: https://i.stack.imgur.com/DVyLQ.jpg

标签: htmlangular

解决方案


这通常是通过在路由器插座之外设置常量元素(如仪表板)的布局来实现的。说,在您的 AppComponent 中:

<app-navbar></app-navbar>
<app-vertical-nav></app-vertical-nav>
<router-outlet></router-outlet>
<app-footer></app-footer>

推荐阅读