Question

现在我试图抓取推文图片的网址，但只有在推文包含图片的情况下才能抓取。我成功地能够推送推文并提取一些图片，但如果推文不是＆＃ 39;有图像，它会断开并停止显示推文。

tweets.component.html

<div *ngFor="let item of tweetsdata">
  <div class="profile-pic><img  src={{item.user.profile_image_url}}>
  </div>

  <div class="screenname">{{item.user.name}}</div>

  <div class="tweet-content">{{item.text}}</div> <!-- correctly pulls in all tweets -->

 <div class="tweet-img">
    <img src="{{item.entities.media[0].media_url}}" /> <!-- breaks when post doesn't have a photo, no more tweets load after it -->
</div>

</div>

我尝试将源设置为.ts文件中的字符串，如果返回null，则有条件地更改字符串的值，如下所示：

<p>{{item.entities.media[0].media_url != null ? item.entities.media[0].media_url : 'hello'}}</p>

但是我认为它不会起作用，因为我从JSON中撤出，并且不想重新分配任何东西。我该如何解决这个问题？

Answer 1

在将图像分配给src属性之前，您可以添加一个检查以将div插入带有* ngIf的DOM

<div *ngFor="let item of tweetsdata">
  <div class="profile-pic><img  src={{item.user.profile_image_url}}>
  </div>

  <div class="screenname">{{item.user.name}}</div>

  <div class="tweet-content">{{item.text}}</div> 
 <div class="tweet-img" *ngIf="item.entities.media[0].media_url">
    <img src="{{item.entities.media[0].media_url}}" /> 
</div>

有条件地链接到角度来自twitter4的图像

1 个答案: