Question

我是Angular的新手，我已经编写了用于使用Angular 5和springboot轻松登录到主屏幕工作流程的代码。在桌面视图中，看起来不错。但是，当我使用F12切换到移动视图时，每个模板都堆积在先前单击的模板上。例如：登录屏幕显示在主屏幕下方。

我已经检查了我的app-route.module.ts和home-route.module.ts，如下所示。

app-route.module.ts

export const appRoutes: Routes = [
    {
       path: '',
       loadChildren: './home/home.module#HomeModule'
    },
    {
        path: 'login',
        loadChildren: './login/login.module#LoginModule'
    }
];
export const ROUTING: ModuleWithProviders = RouterModule.forRoot(appRoutes, 
    { useHash: true });

home-route.module.ts

const routes: Routes = [
    {
       path: '',
       component: HomeComponent,
       children: [
       { path: '', redirectTo: 'login', pathMatch: 'full' },
]
    }
];

@NgModule({
  imports: [RouterModule.forChild(routes)],
  exports: [RouterModule]
})
export class HomeRoutingModule { }

app.component.html

<div>
  <session-timeout-modal></session-timeout-modal>
  <!-- side navbar -->


  <div id="content" class="custom-container-width" [class.hide- 
content]="!isNaviClose" [class.loginView]="!isLoggedInForView">

    <!-- header -->
    <app-header *ngIf="isLoggedInForView"></app-header>

<!--     <sidebar-nav [class.height-content]="isNaviClose" 
  *ngIf="isLoggedInForView" (logout)="logOut()" 
  [isLoggedInForView]="isLoggedInForView"
      (sideBarChange)="naviChecker($event)"></sidebar-nav> -->

   <div class="container container-icons-home "  style="margin-left:100px" 
   *ngIf="isLoggedInForView">
     <div class="row tile-container">


         <div class="tile-art"  routerLink="/">
             <i class="fas fa-search fa-2x"></i>
         </div>  

         <div class="tile-art" routerLink="/">
             <i class="far fa-list-alt fa-2x"></i>
          </div> 

         <div class="tile-art"> 
         <confirm-modal-logout (logout)="logOut()"></confirm-modal-logout>
          </div>

      </div> 
  </div>
    <!-- main contents -->
    <div class="container-fluid inner-content login-container-height">
      <router-outlet></router-outlet>
    </div>
    <app-footer *ngIf="isLoggedInForView"></app-footer>

  </div>
</div>

为什么在移动视图的同一页面中，角度模板在一个页面上显示为一个页面上方？

0 个答案: