在单个JSON对象中重复数组（Ioinc 2）

Question

我有一个JSON对象，其中包含一系列成分，我想将每个对象重复为<li>，以便我可以列出它们。我想重复的区域是“ingredientLines”

我的JSON是

我目前的代码是，我目前只是在一个<li>

中列出了所有10个对象

<ion-content>
    <ion-list>
        <ion-item>
            <div class="thumb">
                <ion-img src="{{api?.images["0"].hostedLargeUrl}}">
                <h1>{{api?.name}}</h1>
            </div>
            <div class="action-bar">
                <div class="like">
                </div>
                <div class="time">
                    <span>{{api?.totalTime}}</span>
                </div>
                <div class="share">
                </div>
            </div>
            <div class="ingredients" ng-repeat="items in api">
                <ul>
                    <li>{{api?.ingredientLines}}</li>
                </ul>
            </div>
        </ion-item>
    </ion-list>
</ion-content>

如果有人能指出我哪里出错了那就太棒了！

Answer 1

尝试在正确的HTML元素中重复正确的对象，你会没事的。以下是您尝试实现的abstract working fiddle。

<div class="ingredients">
    <ul>
        <li *ngFor="let item of api?.ingredientLines">{{item}}</li>
    </ul>
</div>