Question

我目前在Angular中遇到布局问题，我希望有一个我暂时没有想到的快速（笑笑）修复程序。

这是当前布局结构的直观表示。（顶部的小黑条只是设计的标签）

在HTML app.component.html中，它看起来像这样。

<div id="wrapper">
  <app-navbar></app-navbar>
  <div id="content">
    <router-outlet></router-outlet>
  </div>
  <app-footer></app-footer>
</div>

我遇到的问题是，我的应用程序中现在有一个页面完全破坏了该布局模型和上面显示的Angular router-outlet结构。这是视觉效果。

如您所见，左侧有一个新的导航栏，占据了所有垂直高度。现在，旧的导航栏会缩小到剩余宽度，而router-outlet的内容会缩小到剩余宽度（即使第一张图像的两边都有一定的余量，它们在第一张图片中都是全角）。

应用程序中已经有很多视图，这是唯一具有这种布局的视图。

一切仍然需要响应，我想不出一个简单的解决方法，即不完全将大部分布局重新做为本质上是两个导航栏，而导航栏和内容将扩展为填充第二个导航栏的剩余宽度不可见。

有一些解决方法，但是这使响应成为噩梦，我希望避免这种情况。我在想这个吗？