Question

我正在使用幻灯片在Ionic 3中开发app。我在加载视图时使用* ngFor创建幻灯片。我已将loop属性保持为true，以便在从上一张幻灯片导航后可以看到幻灯片1。以下是我的代码

<ion-slides loop>
<ion-slide *ngFor="let card of myCards; let i=index">
<ion-card>{{card.name}}</ion-card>
</ion-slide>
</ion-slides>

幻灯片在设备上正确呈现。然而，当我从最后一张幻灯片旁边滑动时，我看到幻灯片2而不是幻灯片1.如果我在看到幻灯片2时稍微拖动屏幕，我会看到幻灯片1.我不确定视图是否未获得更新或其他内容。如果我做错了什么，有人可以帮助我吗？

修改我在ionViewWillEnter事件中从存储中获取卡阵列：

this.storage.get(val =>{
this.myCards = val;
})

数组具有以下结构：

[{'name': 'xyz', 'message': 'message1'},
{'name': 'pqr', 'message': 'message2'}, 
{'name': 'abc', 'message': 'message3'}]

Answer 1

我认为您的数组操作或存储操作存在一些问题。请尝试以下代码。

this.myCards = [
                   {'name': 'xyz', 'message': 'message1'},
                   {'name': 'pqr', 'message': 'message2'}, 
                   {'name': 'abc', 'message': 'message3'}
               ];

如果上面的代码工作正常，则问题在于存储操作或数组操作。

离子滑环在最后显示第二张幻灯片

1 个答案: