ionic2滑块不能与* ngFor - angular2一起使用

Question

问题的屏幕打印!!

当我们点击跳过按钮时，登录页面已打开！

登录页面！

现在，再次点击主页图标，将打开Slider页面!!

问题：

- 滑块停止工作！在尝试滑动时，只显示一个图像并且它没有工作..！

以下是代码：

＆＃13;

＆＃13;

    slides = [
        {
          title: "Welcome to the Platform!",
          description: "The <b>Ionic Component Documentation</b> showcases a number of useful components that are included out of the box with Ionic.",
          image: "img/ica-slidebox-img-1.png",
        },
        {
          title: "What is platform?",
          description: "<b>Ionic Framework</b> is an open source SDK that enables developers to build high quality mobile apps with web technologies like HTML, CSS, and JavaScript.",
          image: "img/ica-slidebox-img-2.png",
        },
        {
          title: "What isPlatform?",
          description: "The <b>Ionic Platform</b> is a cloud platform for managing and scaling Ionic apps with integrated services like push notifications, native builds, user auth, and live updating.",
          image: "img/ica-slidebox-img-3.png",
        }
    ];
    
    

＆＃13;

<ion-content class="home-slider-page">
	<ion-slides pager>
		<ion-slide *ngFor="let slide of slides">
			<ion-toolbar>
				<ion-buttons end>
					<button block (click)="goToCategoryPage()">
						Skip
					</button>
				</ion-buttons>
			</ion-toolbar>
			<img [src]="slide.image" class="slide-image"/>
			<h2 class="slide-title" [innerHTML]="slide.title"></h2>
			<p [innerHTML]="slide.description"></p>
		</ion-slide>
		<ion-slide>
			<ion-toolbar>
			</ion-toolbar>
			<img src="img/ica-slidebox-img-4.png" class="slide-image"/>
			<h2 class="slide-title">More Products?</h2>
			<button large clear (click)="goToCategoryPage()">
				Continue
				<ion-icon name="arrow-forward"></ion-icon>
			</button>
		</ion-slide>
	</ion-slides>
</ion-content>

＆＃13;

＆＃13;

＆＃13;

Answer 1

添加延迟可以修复此错误。

在你的手稿文件中

.removeitem

查看

 export class SliderPage {
   loaded = false;
   constructor() {

   }
   ionViewLoaded() {
     setTimeout(() => {
       this.loaded = true;
     }, 400);
   }
 }

Answer 2

我不确定我是否理解正确，但我不认为这是一个问题，因为第一次工作正常。只有当您第二次打开页面时，它才会起作用。

同样在你的最后一个屏幕截图中，滑块似乎只有一个页面..我认为它是你的页面的问题，也许你从slide变量中删除，或者你做了一个错误的初始化（在页面上你清理的事件）幻灯片变量）。