【问题标题】:cannot navigate to left side menu or open new report?无法导航到左侧菜单或打开新报告?
【发布时间】:2020-09-13 19:15:12
【问题描述】:

我在 Angular 7 应用程序上工作我面临的问题是我的问题是无法导航

左侧菜单。我只能从左侧菜单中选择一份报告,但无法导航

直到我重新加载组件报告类别意味着必须进入主菜单才能打开新报告。

报告类别组件:

<div class="row" style="display: block;float: left;margin-left:10px; margin-top: 2px;">  
    <div class="page-sidebar navbar-collapse collapse">  
    <nav class="colsm12" id="">  
            <ul *ngFor="let rep of reportlist" class="accordion"  style="margin-top:2px;"  class="page-sidebar-menu" data-keep-expanded="false" data-auto-scroll="true" data-slide-speed="200">  

                    <li class="active open">  
                        <a  id="menu" >  
                            <i class="rep.menuIcon"></i>  
                            <span >{{rep.reportCategory}}</span>  

                        </a>  
                        <ul *ngFor="let subrep of subreportlist"  style="display:block;" id="submenu" style="padding-left:7px;">  


                            <div *ngIf="subrep.reportCategoryID === rep.reportCategoryID" class="wrapper" >  


                              <a [routerLink]="['/pages/report/reportdetails']" [queryParams]="{id: subrep.reportID}" >  


                                            <span class="sideNav nav navbar">{{subrep.reportName}}</span>  

                                        </a>  

                            </div>  



                        </ul>  



            </ul>  
        </nav>  
        </div>  
    </div>

    <div class="col-12">  
        <router-outlet></router-outlet>  
        </div> 

应用路由模块

path: 'pages',component: PagesComponent , children: [{ path: '', component: HomeComponent },

{path:'report',component:ReportcategoryComponent,children:[
{path:'reportdetails',component:ReportdetailsComponent},
{path:'reportdetails/:id',component:ReportdetailsComponent},
]},

当从左侧上方的任何报告导航时,没有任何变化,也不会转到相关的报告详细信息报告。

请问如何解决导航新报告问题?

【问题讨论】:

  • 所以任何人都可以帮助我,我可以在讨论完成后更清楚地说明问题
  • 如果可能的话,谁能支持我

标签: angular7 angular-routing angular-components angular-router angular-routerlink


【解决方案1】:

在路由器插座上,我从路由器插座中删除类 bootstarp

<div class="col-12">  
        <router-outlet></router-outlet>  
        </div> 

当从路由器出口移除 class="col-12" 它工作没有任何问题

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2012-05-23
    • 1970-01-01
    • 2017-08-05
    • 2015-12-24
    • 2016-06-20
    相关资源
    最近更新 更多