Angular 显示角度应用程序中的2个工具栏问题

我有一个角度项目，其中我有两个工具栏： 第一个是整个应用程序的修复工具栏。我将此代码放在组件工具栏中：

<-- toolbar.component.css-->  
mat-toolbar {
  position: fixed;
  justify-content: space-between;
  align-items: center;
  top: 0;
  z-index: 1000;
}

<--toolbar.component.html-->
<mat-toolbar>
   ...
</mat-toolbar>

垫工具栏{
位置：固定；
证明内容：之间的空间；
对齐项目：居中；
排名：0；
z指数：1000；
}
...

第二个工具栏位于另一个组件内：

<--component.css-->
mat-toolbar {
  position: relative;
  justify-content: space-between;
  align-items: center;
}

<--component.html-->
<mat-toolbar color="primary">
   ...
</mat-toolbar>

垫工具栏{
位置：相对位置；
证明内容：之间的空间；
对齐项目：居中；
}
...

我的问题是第二个工具栏没有呈现。第二个工具栏应该在固定工具栏之后渲染

我正在调用app.component.html中的两个组件

---

有人能帮我吗？

在浏览器中检查开发人员控制台。如果它有一些错误，它可能没有呈现。还要检查第二个组件中是否有*ngIf或隐藏。如果一切正常，则检查元素并检查该组件是否已加载。

工具栏内部没有任何ngfor。只有两个简单的工具栏插入到两个独立的组件中。还将渲染这两个组件。我认为问题来自css，因为当我更改第二个toobar并添加z_索引和top=0时，它会呈现在第一个toobar的顶部。通常，角度本身会将元素一个置于另一个之下，因此一些css会导致问题。尝试删除所有自定义css并检查其是否正常工作