从Ionic页面S3获取已签名图像url
在离子中,我有一组图像键。使用这些密钥,我们希望获得Amazon S3签名的URL。从Ionic页面S3获取已签名图像url
我:
<div *ngFor="let image of item.images">
<div>Key: {{image}} -- Url: {{getImageUrl(image) }}</div>
</div>
在JavaScript部分我有以下几点:
getImageUrl(imageKey) {
this.s3.getSignedUrl('getObject', {'Key': imageKey}, (err, url) => {
console.log(url);
return url;
});
}
在我看到的网址是正确的日志。但是在html页面中;什么也没有。我尝试了很多东西;例如通过getImageUrl方法创建一个新变量;这仍然没有定义。
我应该如何修改我的代码才能使其工作?
我强烈的印象是,这是由angularJS/Ionic/...的异步性质造成的,可能我需要使用回调。然而;我无法理解你将如何将该回调变为HTML ... 我希望这是一个初学者的问题!
谢谢!
的问题是,如果你想显示图像,您应该使用标签,空div不会显示任何东西,试试这个
<div *ngFor="let image of item.images">
<div>
<h1> Key: {{image}} -- Url: {{getImageUrl(image) }}
</h1>
<img *ngIf="image" [src]= {{getImageUrl(image) }}>
</div>
</div>
符号上的小项目:它似乎是: 该函数现在似乎被调用很多次(为什么不是一次?但结果是在我的浏览器中
... –
,因为您在ngFor中调用。由于结果是异步的,因此您需要使用异步管道 – Sajeetharan
你在哪里调用getImageUrl – Sajeetharan
对不起,错的复制粘贴。我在html中调用它。我调整了这个问题。 –