Question

我在此项目中使用Angular Material，到目前为止，其他所有功能似乎都可以正常工作。但是由于某种原因，添加mat-card并没有做任何事情。从我在其他地方看到的内容来看，它至少应该添加类.mat-card，但它甚至没有这样做。

代码为<h2 mat-card >Details</h2>。我还在<div>元素上尝试过：仍然没有。

模块MatCardModule的导入方式与我在此项目中使用的所有其他模块完全相同。

尝试按照此处另一个问题的建议增加边距。没有解决。有什么我可以尝试的吗？

Answer 1

纸牌是元素，而不是属性。您可以将其用作元素，也可以为h2标签添加class =“ mat-card”。

检查下面的链接。

https://stackblitz.com/edit/angular-gnaboe?file=app/card-fancy-example.html

Answer 2

mat-card应该像component一样使用

<mat-card>Simple card</mat-card>

在mat-card内，您可以添加mat-card-content，mat-card-title等

docs

中的示例

<mat-card class="example-card">
  <mat-card-header>
    <div mat-card-avatar class="example-header-image"></div>
    <mat-card-title>Shiba Inu</mat-card-title>
    <mat-card-subtitle>Dog Breed</mat-card-subtitle>
  </mat-card-header>
  <img mat-card-image src="https://material.angular.io/assets/img/examples/shiba2.jpg" alt="Photo of a Shiba Inu">
  <mat-card-content>
    <p>
      The Shiba Inu is the smallest of the six original and distinct spitz breeds of dog from Japan.
      A small, agile dog that copes very well with mountainous terrain, the Shiba Inu was originally
      bred for hunting.
    </p>
  </mat-card-content>
  <mat-card-actions>
    <button mat-button>LIKE</button>
    <button mat-button>SHARE</button>
  </mat-card-actions>
</mat-card>

角材料-方向垫卡无任何作用

2 个答案: