文章/答案/技术大牛

发布

社区首页 >问答首页 >如何解决相互冲突的布局

问如何解决相互冲突的布局
EN

Stack Overflow用户

提问于 2021-05-11 21:11:53

回答 1查看 41关注 0票数 1

在“角-11”应用程序中，我使用了两种不同的布局：

登陆页
主页

我正在使用AdminLTE-3主题

登陆页有自己的布局，这没有侧边栏。其布局的body类是不同的：

<body class="hold-transition layout-top-nav layout-fixed layout-navbar-fixed layout-footer-fixed">
  <div class="wrapper">
    <app-landing-topnavbar></app-landing-topnavbar>
    <div class="wrapper">
        <router-outlet></router-outlet>
    </div>
    <app-landing-footernavbar></app-landing-footernavbar>
  </div>
</body>

主要布局：

<body class="hold-transition sidebar-mini layout-fixed">
  <div class="wrapper">
    <app-headerbar></app-headerbar>
    <app-sidebar></app-sidebar>
    <div class="wrapper">
      <router-outlet></router-outlet>
    </div>
    <app-footerbar></app-footerbar>
  </div>
</body>

这是index.html

<!doctype html>
<html lang="en">

<head>
  <meta charset="utf-8">
  <title>iDriver</title>
  <base href="/">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="icon" type="image/x-icon" href="favicon.ico">
  <link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
</head>

<body>
  <app-root></app-root>
</body>

</html>

默认情况下，应用程序应该加载登陆页。但是，当用户成功登录时，它会重定向到使用主布局的主应用程序。

我的观察是，当用户呈现登陆页面时，页面会向右移动，就好像它有一个侧面，而不应该是这样。这应该只适用于主页。

但当我在登陆页面布局中复制类时：

<body class="hold-transition layout-top-nav layout-fixed layout-navbar-fixed layout-footer-fixed">

用它代替普通的index.html，登陆页面就可以了。

我如何最终解决这个问题？

谢谢

angular

回答 1

Stack Overflow用户

发布于 2021-05-11 22:55:38

我认为你需要重新考虑你的路线。您可能不会使用(第三个)主应用程序组件来呈现主页面和登陆页之间共享的内容。在该组件中，您放置一个路由器出口并设置upp一个路由器结构，根据路由(url)呈现相关的子组件。

票数 0

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/67494413

复制

相似问题

问如何解决相互冲突的布局
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问如何解决相互冲突的布局EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问如何解决相互冲突的布局
EN