Question

所以我的角度项目遇到了问题。首次加载应用程序时，不显示选项卡。但是，一旦我单击该应用程序，我的选项卡就可以正常工作。

相关代码是这样的：在rooms.component.html中：

<mat-tab-group color="accent" class="rooms">
<mat-tab *ngFor="let room of rooms"
[class.selected]=" room === selectedRoom"
(click)="onSelect(room)" label="{{room.name}}">
<mat-card class="example-card">
    <mat-card-header>
      <div mat-card-avatar class="example-header-image"></div>
      <mat-card-title>{{room.name}}</mat-card-title>
      <mat-card-subtitle>${{room.price}} por noche</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>
        Equipada con:
        -Cafetera
        -Minibar
        -Garrafa de agua
        -TV
        -Reloj Despertador
        -Baño
        -Secadora de pelo
        -Ducha de agua caliente
      </p>
    </mat-card-content>
    <mat-card-actions>
      <button mat-raised-button>Reservar</button>
      <button mat-button>Compartir</button>
    </mat-card-actions>
  </mat-card>
</mat-tab>
</mat-tab-group>

在app.component.html上

<mat-toolbar color="primary">
  {{ title }}
</mat-toolbar>
<app-rooms></app-rooms>

Mat-Tab-Group直到单击后才加载

0 个答案: