Html 如何实现flexLayout Div在Angular中占据100%的父容器?
我正在开发一个AngularFlexLayout应用程序,我正在尝试使用AngularFlexLayout实现一个响应性布局,但是我在容器高度方面遇到了一些问题 我已经附上了一张照片,我希望它看起来像什么,但目前,在桌面上,它并没有占据整个高度 下面是我正在使用的代码 任何帮助都将不胜感激。我希望清楚我在找什么 HSHtml 如何实现flexLayout Div在Angular中占据100%的父容器?,html,css,angular,flexbox,angular-flex-layout,Html,Css,Angular,Flexbox,Angular Flex Layout,我正在开发一个AngularFlexLayout应用程序,我正在尝试使用AngularFlexLayout实现一个响应性布局,但是我在容器高度方面遇到了一些问题 我已经附上了一张照片,我希望它看起来像什么,但目前,在桌面上,它并没有占据整个高度 下面是我正在使用的代码 任何帮助都将不胜感激。我希望清楚我在找什么 HS {{id} {{item.text}大写} {{item.text} {{item.text}大写} {{item.text} {{item.text}小写} {{item.
{{id}
{{item.text}大写}
{{item.text}
{{item.text}大写}
{{item.text}
{{item.text}小写}
{{item.text}大写}
{{item.text}
{{button.text}
关闭
<div class="container" fxLayout="column" >
<div class="segment" fxLayout="column" fxFill>
<div fxLayout="row" fxLayoutAlign="end start" class="id" fxFlex="5">
<p>{{ id }}</p>
</div>
<div class="" fxFlex="80" fxFill>
<div >
<div *ngFor="let item of items">
<div [ngSwitch]="p.type">
<div *ngSwitchCase="'case1'" >
<p>{{ item.text | uppercase }}</p>
</div>
<div *ngSwitchCase="'case2'" class=>
<p>{{ item.text }}</p>
</div>
<div *ngSwitchCase="'case3'" >
<p>{{ item.text | uppercase }}</p>
</div>
<div *ngSwitchCase="'case4'" >
<p>{{ item.text }}</p>
</div>
<div *ngSwitchCase="'case5'" >
<p>{{ item.text | lowercase }}</p>
</div>
<div *ngSwitchCase="'case6'" >
<p>{{ item.text | uppercase }}</p>
</div>
<div *ngSwitchCase="'case7'" >
<p>{{ item.text }}</p>
</div>
</div>
</div>
</div>
</div>
<div class="buttons" fxLayout="row" fxLayoutAlign="space-evenly center">
<div *ngFor="let button of buttons">
<button
mat-stroked-button
>
{{ button.text }}
</button>
</div>
<div class="default--button" fxLayout="row" fxLayoutAlign="space-between center">
<div *ngIf="isTypeButton">
<button mat-stroked-button >
<mat-icon>close</mat-icon>
</button>
</div>
</div>
</div>
</div>