我有一个angular应用程序，发现它有一个错误的布局行为，与计划的结构不符。Bellow是代码：
index.html包含以下代码：
<body>
<app-root></app-root>
<!-- Footer -->
<footer>
Something is here
</footer>
</body>
app.component.html包含以下内容：
<div>
toolbar is here
...
</div>
<router-outlet></router-outlet>
然后我有一个主要组件：
<h1>Main component starts here</h1>
<div>
Something for the main component
</div>
<h1>Main component finishes here</h1>
因此，我希望看到以下结构：
- 工具栏
2.1主要组件从这里开始
2.2主要成分
2.3主要部件在此完成
- 页脚
但我看到组件的顺序错误：
- 工具栏
2.1。主要组件从这里开始
2.3.主要部件在此完成
- 页脚
2.2.主要成分
为什么页脚没有在此处显示为最后一个组件？关于如何解决这个问题有什么想法吗？
如果你试图在app.component.html中移动页脚代码，会发生什么
- index.html将如下所示：
<body>
<app-root></app-root>
</body>
- app.component.html将如下所示：
<div> toolbar is here </div>
<router-outlet></router-outlet>
<footer> Something is here</footer>