Angular 4 Material：使用 flex 包裹元素答案

【问题标题】：Angular 4 Material : use flex to wrap elementsAngular 4 Material：使用 flex 包裹元素
【发布时间】：2017-11-25 21:12:53
【问题描述】：

我想知道如何使用 flex 来包装我的“产品”元素，比如这个例子（angular js）：

我正在使用带有 Material.io 的 Angular 4，我看到了 flex 用于响应式。

但是在这段代码中，我可以看到：

<div class='md-padding' layout="row" layout-wrap>

layout="row" 和 layout-wrap 在 Angular 4 中不存在....

如果你有例子，谢谢！

【问题讨论】：

【解决方案1】：

它确实存在，但它与 Angular Material 的耦合度并不高。你应该添加一个额外的包来使用它。

这是Angular Flex Layout。如您所见here，您所描述的属性也可用。

【讨论】：

【解决方案2】：

这些标签来自angularjs-material。您可以使用普通的flexbox css 来复制这些属性：

myDiv {
  display: flex;
  flex-flow: row wrap;
}

【讨论】：