时间戳

首页 > 解决方案 > displaying 2 toolbar problem in angular application

angular - displaying 2 toolbar problem in angular application

问题描述

I have an angular project in which I have 2 toolbar: The first one is a fix toolbar for the whole application. I am putting this code inside a component toolbar:

<-- 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>

The second toolbar is inside another component:

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

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

My problem is that the second toolbar is not rendered. the second toolbar shoud get rendered just after the fixed toolbar.

I am calling the two components inside my app.component.html

Could someone help me with this ?

标签： angularangular-materialtoolbar

解决方案

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

推荐阅读