在Angular材质扩展面板中更改布局

Question

如何更改扩展面板内部的布局以使其具有行布局？ 据我所知，无论什么类型的<div fxLayout="row" ...等，我尝试在扩展面板中始终具有列布局。

示例代码：

<mat-expansion-panel-header>
    <mat-panel-title>
        Skills
    </mat-panel-title>
</mat-expansion-panel-header>

    <div fxLayout="row" fxLayoutAlign="center center">
            <div>
                <p>Test</p>
            </div>
            <div>
                <p>Test</p>
            </div>
            <div>
                <p>Test</p>
            </div>
    </div>
</mat-expansion-panel>

将返回

Test
Test
Test

Answer 1

确保已包含flex-layout模块-如果不确定，请尝试使用设置{display：flex;的类替换fxLayout属性。 }，也可以使用style =“ display：flex;”在该div上内联添加。 （flex-direction：row为默认值）