使用flex布局在angular 2材质中开发响应式布局

Question

如何使用flex布局在angular 2材质中开发响应式布局。在angular材质中，我们使用下面的代码在桌面和移动视图上进行响应式布局。例如。

<div layout="row" layout-xs="column" layout-wrap="" layout-align="center center">
    <div flex="33" flex-xs="100">
    </div>
    <div flex="33" flex-xs="100">
    </div>
    <div flex="33" flex-xs="100">
    </div>
</div>

Answer 1

我在这个时候使用它。它真的很舒服。

要安装它：Click

更多信息在这里：Click

通过示例在css中使用它：Click

下面是一个在线示例：Click

您只需要确定在何处使用flex-container和flex-item类。并且您需要将fxLayout和fxLayoutAlign指令设置为真。它处理剩下的工作。

我在@angular 2.4.3中使用它