布局对齐不适用于 angular material

Question

我有这段代码，这里当屏幕尺寸大于 small 时布局对齐工作正常但当它小于 Small 布局对齐不起作用

<div layout-gt-sm="row" layout-lt-sm="column" flex layout-align="space-around center">

    <!-- main content like jokes and news will go here -->
    <div flex-gt-sm="55" flex="80">
        <md-card class="md-whiteframe-5dp">
            hello</md-card>

    </div>
    <!-- todo and upcoming event will go here -->
    <div flex-gt-sm="35" flex="80">
        <div>
            <ng-include src="'templates/dashboard/todo.html'"></ng-include>
        </div>
        <div>
            <ng-include src="'templates/dashboard/todo.html'"></ng-include>
        </div>

    </div>

</div>

谢谢

Answer 1

Angular Material 不再提供 layout-lt-* 指令。相反，你应该这样做：

<div layout="column" layout-gt-sm="row">

这可能会导致您的布局对齐指令不起作用，因为它们目前在您的代码中没有父布局。

您可以在这里阅读更多内容：https://material.angularjs.org/HEAD/layout/container

布局对齐不适用于 angular material

layout-align not working in angular material

angularjs

angular-material