我在使用 ngFor 时遇到了一些问题,无法从其他问题中找到我的解决方案,如果有人可以提供一些非常有帮助的建议。
我目前的代码是这样的:
<ion-list *ngIf="items.length">
<ion-item-sliding style="background-color: #ff2d85" #item>
<ion-item *ngFor="let item of items; let i = index">
<ion-avatar item-start><img src="../../assets/imgs/{{item.prodAvatar}}">
</ion-avatar>
<h2 id=prod{{i}}Title>{{item.prodTitle}}</h2>
<h3 id=prod{{i}}Desc>{{item.prodDesc}}</h3>
<p id=prod{{i}}Little>{{item.prodLittle}}</p>
<button id="bt{{i}}" ion-button outline item-end class="listbutton"
(click)="cart([i])"><ion-icon name="basket"></ion-icon></button>
</ion-item>
<ion-item-options side="right">
<button ion-button expandable></button>
</ion-item-options>
</ion-item-sliding>
<ion-item>
<button ion-button>NEW PAGE</button>
<button ion-button secondary menuToggle>MENU</button>
<button (click)="openVibrate()" ion-button>VIBRATE</button>
<button (click)="openCamera()" ion-button>CAMERA</button>
</ion-item>
</ion-list>
这很好地显示了我的数据,除了列表上的 slider 仅在此列表中的第一个对象上滑动的问题,这是显而易见的,因为滑动元素在 for 循环之外。但是,当我将 ngFor 放在 <ion-item-sliding>
中时, 所有数据使用 {{i}}
, 仍然存在,但数据使用 {{item.anything}}
现在是空白。
解决方案可能一目了然,但我看不出它是什么
任何人都可以提供任何见解吗?
最佳答案
您需要在ion-item-sliding
标签中使用ngFor
。
<ion-item-sliding *ngFor="let item of items; let i = index" style="background-color: #ff2d85" #item1>
关于javascript - 通过数组在 Ionic/Angular ngFor 中遇到问题,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/47451665/