角度2組件未填滿屏幕

Question

我的根組件未填充屏幕高度。根分量模板如下：

<md-toolbar color="primary" id="tool"> 
    <div fxLayout="row" style="width: 100%"> 
    <div fxFlex="10" fxFlexAlign="center"> 
     <md-icon (click)="navigateBack()" [hidden]="!showBackNavigation">keyboard_arrow_left</md-icon> 
    </div> 
    <div fxFlex="70" fxFlexAlign="center"> 
    <span> 
     {{headerTitle}} 
    </span> 
    </div> 
    </div> 
</md-toolbar> 
<router-outlet> 
</router-outlet> 

我想要做的是爲所有標籤設置最小高度：100％，但這並不奏效。如果我以像素爲單位設置高度，它會正確更新。我怎樣才能使內容填充窗口的高度？

Screenshot with HTML layout and application

Answer 1

您可能還需要設置min-height: 100%;該元素的父元素，因爲它們可能不會默認。或者，您也可以使用min-height: 100vh;，這將使視口高度的元素爲100％，而不是嘗試填充父項的100％。