angular - 如何使用 Angular Flex Layout 添加边距？

Question

如何在使用 Flex 布局模块时向容器添加边距或填充？

模板:

<div class="container">
  hell
  <div fxLayout="column" fxLayoutAlign="center center">
    <mat-card fxFill>Simple card test</mat-card>
  </div>
</div>

风格:

.container{
    margin: 60px;
}

我注意到它似乎没有添加正确数量的 margin 。您将能够在屏幕截图中看到，弹性容器的边距小于其外部的文本。

Answer 1

您可以使用 [style.margin] 属性。

div fxLayout="row"fxLayoutGap="12px"[style.margin-top]="'12px'"[style.margin-left]="'10px'"