mongodb 如何在Angular上显示来自数据集的外部托管图像

68de4m5k  于 2023-02-21  发布在  Go
关注(0)|答案(1)|浏览(94)

目前,我在我的Angular 前端上显示来自数据集的信息。对于数据集中的每个条目,我显示名称、地址、评级和图像。但是,我在显示图像时遇到了一些问题。图像是一个外部HTML链接,存储在"html_attributations"中,而"html_attributations"存储在对象"photos"中。

下面是我目前拥有的代码:

<div class="container">
    <div class="row">
        <div class="col-sm-12">
            <div *ngFor="let place of place_list | async">
                <div class="card text-white bg-secondary mb-3">
                    <div class="card-header">
                        {{ place.name }}
                    </div>
                    <div class="card-body">
                        Address:
                        {{ place.formatted_address }}
                    </div>
                    <div class="card-footer">
                        Rating:
                        {{ place.rating }}
                    </div>
                    <img src = "{{place.photos}}">

                </div>
            </div>
        </div> 
    </div> 
 </div>

我得到这个错误:[对象%20对象]:1获取http://localhost:4200/[对象%20对象] 404(未找到)
我还尝试了{{place. html_attributations}},但不起作用。我将非常感谢您的帮助!

62o28rlo

62o28rlo1#

它应该是:

// code above
<ng-container *ngFor="let photo of place?.photos">
    <ng-container *ngFor="let htmlAttribution of photo?.html_attributions">
         <img src="{{htmlAttribution}}">
    </ng-container>
</ng-container>
// code below

相关问题