Angular 4 Material : 使用 flex 包裹元素

Question

我想知道如何使用 flex 来包装我的 "product" 元素，就像这个例子（angular js）：

我正在使用 Angular 4 和 Material.io，我看到 flex 响应式。

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

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

layout="row" 和 layout-wrap 不存在于 angular 4....

如果有例子，谢谢！

Answer 1

它确实存在，但它与 Angular Material 没有更多耦合。你应该添加一个额外的包来使用它。

是 Angular Flex Layout. As you can see here，您描述的属性在上面也可用。

Answer 2

这些标签来自 angularjs-material. You can use normal flexbox css 以复制这些属性：

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

Angular 4 Material : use flex to wrap elements