数据在html页面上呈现，但当应用样式设置bootstrap4时，它不会显示任何内容吗？

在我的简单angular应用程序中，硬编码数据以简单的格式呈现在网页中，但当应用引导样式和类时，它不会显示任何内容。 请更正以下代码（如果有）：

这是event.component.html：

<div class="media">
  <h3 class="h3-responsive font-weight-bold mr-3">{{ value.time }}</h3>
  <div class="media-body mb-3 ">
    <mdb-badge danger="true" class="text-center float-right">-</mdb-badge>
    <h6 class="mt-0 font-weight-bold">{{ value.subject }}</h6>
    <hr class="hr-bold mb-0 my-2" />
    <p class="mb-0" *ngIf="value.location">
      <mdb-icon fas icon="location-arrow"></mdb-icon>
      {{ value.location }}
    </p>
  </div>
</div>
<p class="p-3 blue-grey lighten-5 blue-grey lighten-5" *ngIf="value.description">
  {{ value.description }}
</p>

   <div class="container">
      <div class="row">
        <div class="col-md-9">
          <div *ngFor="let event of events">
            <app-event [value]="event"></app-event>
          </div>
        </div>
        <div class="col-md-3"></div>
      </div>
    </div>

{{value.time}}
-
{{value.subject}}

{{value.location}}


{{value.description}}

这是app.component.html：

<div class="media">
  <h3 class="h3-responsive font-weight-bold mr-3">{{ value.time }}</h3>
  <div class="media-body mb-3 ">
    <mdb-badge danger="true" class="text-center float-right">-</mdb-badge>
    <h6 class="mt-0 font-weight-bold">{{ value.subject }}</h6>
    <hr class="hr-bold mb-0 my-2" />
    <p class="mb-0" *ngIf="value.location">
      <mdb-icon fas icon="location-arrow"></mdb-icon>
      {{ value.location }}
    </p>
  </div>
</div>
<p class="p-3 blue-grey lighten-5 blue-grey lighten-5" *ngIf="value.description">
  {{ value.description }}
</p>

   <div class="container">
      <div class="row">
        <div class="col-md-9">
          <div *ngFor="let event of events">
            <app-event [value]="event"></app-event>
          </div>
        </div>
        <div class="col-md-3"></div>
      </div>
    </div>

---

这是我发现的：

<div class="media">
  <h3 class="h3-responsive font-weight-bold mr-3">{{ value.time }}</h3>
  <div class="media-body mb-3">
    <span class="badge badge-danger text-center float-right">-</span>
    <h6 class="mt-0 font-weight-bold">{{ value.subject }}</h6>

    <p class="mb-0">
      <i class="fa fa-location-arrow solid" style="font-size:14px;"></i>  {{ value.location }}
    </p>
  </div>
</div>
<p class="p-3 " style="background-color: #D8D8D8;">
  {{ value.description }}
</p>

{{value.time}}
-
{{value.subject}}

{{value.location}}


{{value.description}}

其中的一些类不是来自bootstrap，但不知道theey从何处带来了形式，以及如何在博客中产生输出。我试了很多，终于找到了