在子组件中看不到材料列表网格项

Question

我是Angular7的新手。 我正在用Material编写应用程序。 我试图用两个组件来动态地编写材料网格列表：列表和项目。像这样：

组件列表：

<mat-grid-list cols="3">
    <app-concept-item
    *ngFor="let conceptItem of conceptList"
    (click)="goToConceptDetail(concept.id)"
    [concept]="conceptItem">
    </app-concept-item>
</mat-grid-list>

其中的Item组件（app-concept-item）：

<mat-grid-tile>
    <span>{{concept.name}}</span>
  </mat-grid-tile>

运行代码时，在Chrome Inspect工具中，HTML正确地写入了视图中。但是我什么也看不到，看到一个空白页。

另一方面，如果我不将代码拆分为另一个组件，则完全正确地执行该代码：

<mat-grid-list cols="3">
    <mat-grid-tile
    *ngFor="let concept of conceptList"
    (click)="goToConceptDetail(concept.id)">
        <span>{{concept.name}}</span>
    </mat-grid-tile>
</mat-grid-list>

第二个代码的结果是：

我在任何解决方案中都没有任何CSS代码。 第一个不显示任何内容，第二个不显示您在图片中看到的内容。

任何帮助表示赞赏。

谢谢。