Question

这就是我要做的事情：

<md-grid-list cols="3">
    <product *ngFor="let product of products" [product]="product"></product>
</md-grid-list>

产品组件包含 md-grid-tile 。

问题：
切片不可见（但它们在DOM中呈现）。如果我将 md-grid-tile 直接放在列表下面，但是我想保持我的代码清洁并使用我自己的组件...

有什么我想念的吗？也许我可以添加一些CSS黑客来显示瓷砖？

任何帮助将不胜感激，谢谢！

Answer 1

来自对该问题的评论：

但是，在你的产品模板中放置html的其余部分并在其上设置click事件是不够的？并设定高度：100％;宽度：100％;在产品组件上（可能是您要在组件css中使用：host选择器）

这就是我解决它的方法：

<md-grid-list cols="3">
    <md-grid-tile *ngFor="let product of products">
        <catalog-product [product]="product"></catalog-product>
    </md-grid-tile>
</md-grid-list>

并在产品组件的scss中：

:host{
    width: 100%;
    height: 100%;
}

组件中的angular2材质网格图块

1 个答案: