如何修复“加载时显示第一内容”

时间:2019-05-07 06:47:14

标签: angular angular7

我有4个徽标的列表。根据选择徽标,将显示内容。加载应用程序时,我需要先显示徽标内容。我正在为应用程序使用Angular 7。我该如何解决该问题? 请在下面找到代码

<div class="section-logos">
    <ul class="tem-icons">
        <li *ngFor="let phenomTem of phenomTems"
          [class.selected]="phenomTem === selectedTem"
          (click)="onSelect(phenomTem)" class="col-md" >
            <img src="{{ phenomTem.logoPath }}" alt="Logos">
        </li>
      </ul>
</div>

<div *ngIf="selectedTem" class="section-content">
    <div class="row">
        <div class="col-md-4">
            <small>{{selectedTem.sectionSubTitle}}</small>
            <h2>{{selectedTem.sectionTitle}}</h2>
            <p>{{ selectedTem.sectionDescription }}</p>  
        </div>
        <div class="col-md-8">
            <img src="{{ selectedTem.sectionImage }}" class="sectionimage" alt="image">
        </div>
    </div>
</div>

1 个答案:

答案 0 :(得分:2)

您可以像这样在ngOnInit()上进行更新

ngOnInit() {
    this.onSelect(phenomTems[0]);
}