ОШИБКА TypeError: Невозможно прочитать свойство 'news_category' из неопределенного

Question

HTML

<ion-content>
    <p>{{volunteer.news_category}}</p>

  <ion-grid>
    <ion-row>
      <ion-col>
        <ion-card tappable (click)="goToVolunteerVoteDetail(volunteer)" style="width:26%" class="pin" 
          *ngFor="let volunteer of selectedVolunteer">
          <!-- <p>{{volunteer.news_category}}</p> -->

          <img src="{{volunteer.Preview_image1}}" height="100">
          <div *ngIf="volunteer.title" class="volunteer-title">
            <small>{{volunteer.title}}</small>
          </div>
          <div class="volunteer-title">{{volunteer.like_number}}分</div> <!-- 志愿者评选头像像素：505x505px -->

        </ion-card>
      </ion-col>
    </ion-row>
  </ion-grid>
</ion-content>

Будет показано сообщение об ошибке ниже:

ОШИБКА TypeError: Невозможно прочитать свойство 'news_category' из неопределенного

но если я изменил <p{{volunteer.news_category}}</p> на

<div *ngFor="let volunteer of selectedVolunteer">
   <p>{{volunteer.news_category}}</p>
</div>

, ошибка исчезнет, ​​но вместо нее появится множество news_category .

Я просто хочу показать этотолько один раз.

Answer 1

Поскольку все элементы selectedVolunteer сохраняют одинаковое значение news_category, вы можете просто отобразить первый элемент news_category и отобразить / скрыть его в зависимости от длины selectedVolunteer.

<div *ngIf="selectedVolunteer?.length > 0">
  <p>{{selectedVolunteer[0].news_category}}</p>
</div>