從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 ... 我希望這是一個初學者的問題！

謝謝！

來源

2017-11-11 john johnson

你在哪裏調用getImageUrl – Sajeetharan

對不起，錯的複製粘貼。我在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>

來源

2017-11-11 20:06:38 Sajeetharan

符號上的小項目：它似乎是：該函數現在似乎被調用很多次（爲什麼不是一次？但結果是在我的瀏覽器中 ... –

，因爲您在ngFor中調用。由於結果是異步的，因此您需要使用異步管道 – Sajeetharan

從Ionic頁面S3獲取已簽名圖像url

回答

相關問題