Question

我制作了一个Ionic WordPress应用程序，每次发布一篇没有特色照片的帖子时都会给我一个错误我想要做的是过滤那些没有有照片的帖子但我不知道如何使用 if / else Ionic中的条件。
这是 home.html

的代码

<ion-card *ngFor="let item of items">
    <img src="{{item._embedded['wp:featuredmedia'][0].media_details.sizes.thumbnail.source_url}}"/>
    <ion-card-content>
    ...
    </ion-card-content>
</ion-card>

Answer 1

如果您尝试从items中删除没有缩略图的项目，最好在获得缩略图时在后端执行此操作。

this.items = this.items.filter(function(item) {
  return (item && 
          item._embedded &&
          item._embedded['wp:featuredmedia'] &&
          item._embedded['wp:featuredmedia'][0] &&
          item._embedded['wp:featuredmedia'][0].media_details &&
          item._embedded['wp:featuredmedia'][0].media_details.sizes &&
          item._embedded['wp:featuredmedia'][0].media_details.sizes.thumbnail &&
          item._embedded['wp:featuredmedia'][0].media_details.sizes.thumbnail.source_url);
});

如果您想要获取每个项目，缩略图或否，但隐藏缩略图（如果它不存在），请使用*ngIf标记上的img。

<ion-card *ngFor="let item of items">
  <img *ngIf="item && 
              item._embedded &&
              item._embedded['wp:featuredmedia'] &&
              item._embedded['wp:featuredmedia'][0] &&
              item._embedded['wp:featuredmedia'][0].media_details &&
              item._embedded['wp:featuredmedia'][0].media_details.sizes &&
              item._embedded['wp:featuredmedia'][0].media_details.sizes.thumbnail &&
              item._embedded['wp:featuredmedia'][0].media_details.sizes.thumbnail.source_url"
       src="{{item._embedded['wp:featuredmedia'][0].media_details.sizes.thumbnail.source_url}}"/>
</ion-card>

注意：你应该检查对象的每一层的原因是因为如果缺少任何一个对象，你会得到一个TypeError，说“找不到未定义的属性X”。 < / p>

如何在离子html页面中编写if / else？

1 个答案: