如何在Ionic 3中全屏查看缩略图？
如何在Ionic 3中全屏查看缩略图？
提问于 2018-06-11 04:33:59
我有一个上传到Firebase存储的图像，并且我已经以缩略图的形式查看了这些图像。
我的问题是:我需要点击图像才能全屏查看吗？
注意:图像源包含一个变量{{item.name}}
Home.html
<ion-header>
<ion-navbar>
<ion-title>Home</ion-title>
</ion-navbar>
</ion-header>
<ion-content padding>
<ion-list>
<ion-item *ngFor="let item of employees | async json">
<ion-thumbnail item-start>
<img src="https://firebasestorage.googleapis.com/v0/b/my-ionic-bedde.appspot.com/o/images%2F{{item.name}}.jpg?alt=media&token=be89c991-d6b1-49bf-bb64-cf103c835002">
</ion-thumbnail>
<h2> {{item.name}} {{item.lname}}</h2>
<p>{{item.age}}</p>
<p>{{item.dept}}</p>
<button ion-button clear item-end">View</button>
</ion-item>
</ion-list>
</ion-content>回答 1
Stack Overflow用户
发布于 2018-06-11 07:32:33
您在<ion-item>中使用了<ion-thumbnail>元素，这将简单地将您的图像显示为列表元素中的一个缩略图。(请参阅：https://ionicframework.com/docs/api/components/thumbnail/Thumbnail/)
(您可能会看到类似这样的内容)
如果你想在全屏显示一个图片，你需要自己做这个功能(可能是创建一个新页面或另一个组件)，但与此无关。
无论采用哪种方式，我都建议您在组件中将图像的"src“作为字符串，这样您就可以更容易地将其传递给您选择的全屏解决方案。
我希望它能帮上忙。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/50787800
复制相关文章
相似问题