显示数组中的json数据

时间:2017-09-13 01:53:32

标签: javascript angular typescript

我试图显示我从get请求中获得的一些json数据。到目前为止,我已经能够显示其他阵列没有问题,但由于某些原因我无法显示此特定阵列,并且我没有收到任何错误。

不能正确显示的是showtimes数组。

enter image description here

<div *ngIf="show">
<div *ngFor="let shows of show"class="showtime">
<div class="panel panel-default">
    <div class="panel-heading">
        <h3 class="panel-title">{{shows.title}}</h3>
    </div>
    <div class="panel-body" >
        <div class="row">
            <div class="col-md-7 col-sm-5 col-xs-12 ">

                <img  class="thumbnail movie_pic" src="http://developer.tmsimg.com/{{shows.preferredImage.uri}}?api_key={{api}}"><br>

            </div> 
            <div class="col-md-5 col-sm-7 col-xs-12">
                <ul class="list-group">
                    <li class="list-group-item">Genres: {{shows.genres}}</li>
                    <li class="list-group-rel">Release Date: {{shows.releaseDate}}</li>
                    <li class="list-group-rel">{{shows.longDescription}}</li>
                    <li *ngFor="let shows of show.showtimes" class="list-group-rel">shows.theatre.name</li>
                </ul>

            </div>
        </div>

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

3 个答案:

答案 0 :(得分:4)

您缺少{{}}表达式

<li *ngFor="let shows of show.showtimes" class="list-group-rel">{{shows.theatre.name}}</li>

修改

将其更改为其他变量名称,因为您已经在使用节目,

<li *ngFor="let showdetail of show.showtimes" class="list-group-rel">{{showdetail.theatre.name}}</li>

答案 1 :(得分:1)

从快照看,对象数组存储在变量showtimes中,如果是这种情况,请尝试以下代码:

<li *ngFor="let detail of showtimes" class="list-group-rel">
    {{detail.theatre.name}}
</li>

答案 2 :(得分:0)

嵌套的ngFor循环解决了这个问题..

<div *ngFor="let shows of show"> 
    <div *ngFor="let detail of shows.showtimes"> 
    <p>{{detail.theatre.name}}</p>
    </div>              
</div>

完美无缺,感谢您的帮助