Json 角度4/3张幻灯片的应用

Json 角度4/3张幻灯片的应用,json,javascript,angular,ionic3,ion-slides,Json,Javascript,Angular,Ionic3,Ion Slides,在应用程序初始化时,我正在从服务器中提取文件,其中DATETIME描述了我应该显示特定图像的epoc时间。即使我能够触发第一张幻灯片的更改,我也不能在触发连续的幻灯片时绞尽脑汁 import { Http } from '@angular/http'; import { ViewChild } from '@angular/core'; import { Component } from '@angular/core'; import { AlertController, NavControll

在应用程序初始化时,我正在从服务器中提取文件,其中
DATETIME
描述了我应该显示特定图像的epoc时间。即使我能够触发第一张幻灯片的更改,我也不能在触发连续的幻灯片时绞尽脑汁

import { Http } from '@angular/http';
import { ViewChild } from '@angular/core';
import { Component } from '@angular/core';
import { AlertController, NavController } from 'ionic-angular';
import { Slides } from 'ionic-angular';
import 'rxjs/add/operator/map';
import { FileTransfer, FileTransferObject } from '@ionic-native/file-transfer';
import { File } from '@ionic-native/file';
// declare var cordova:any;

@Component({
  selector: 'page-home',
   templateUrl: 'home.html'
})
export class HomePage {
  @ViewChild(Slides) slides:Slides
  fetchedImages: any;
  images: any;

  imageURI: any;
  imageFileName: any;
  // storageDirectory = cordova.file.directory;

  constructor(
    public navCtrl: NavController,
    public http: Http,
    private transfer: FileTransfer,
    private alertCtrl: AlertController,
    private file: File

  ) {
       this.http.get('http://solosnet.com/signage/test.cfm')
       .map(res=> res.json())
        .subscribe(data=> {
          this.images = data;
        }
       );
    }


   goToNext(index, time) {
     var multiplied = time*1000;
     var eta_ms = multiplied - Date.now();
     console.log(eta_ms);
     setTimeout(()=> {
       this.slides.slideNext();
       console.log('Fired!');
      }, eta_ms);
    }

    startSlides() {
      if ( this.images !== undefined) {
        this.goToNext(1, this.images[1].DATETIME);
      }
    }

    slideChanged() {
      let currentIndex = this.slides.getActiveIndex();
      let nextIndex = currentIndex + 1;
      console.log('Current index is ', currentIndex);

      this.goToNext(nextIndex, this.images[nextIndex].DATETIME);
    }
}
有没有办法创建一个时间表,每次
Date.now
等于
JSON
对象中的
DATETIME

[
   {
     UUID: "uuid-johna1",
     FILE: "http://movieaddigital.com/output/ba3390-
            013f1255f293cfc4334c569d55f6682f-5_1920x1080.jpg",
     DATETIME: 1510767348
   },
   {
     UUID: "uuid-john2a",
     FILE: "http://movieaddigital.com/output/ho1199-       
            5e01d368ebc1e2fcc5be429c315afe9e_1920x1080.jpg",
     DATETIME: 1510767468
   }
]
最后是我的HTML

<ion-content>
    <ion-slides *ngIf="images" class="image-slider" loop="false" 
slidesPerView="1" (ionSlideDidChange)="slideChanged()">
        <ion-slide *ngFor="let img of images ">
            <img [src]="img.FILE" class="slide-image" /> 
       </ion-slide>
    </ion-slides>
</ion-content>


你能分享你的JSON对象是什么吗?这听起来像是rxjs解决方案的一个很棒的应用程序。你甚至不能触发第二个,是吗?你能给我们看一下幻灯片的html代码吗?我可以触发第二个和连续的幻灯片,但它们不会超时,并且几乎在同一时间被触发。你能分享你的JSON对象是什么吗?这听起来像是rxjs解决方案的一个很棒的应用程序。你甚至不能触发第二个,是吗?你能给我们看一下幻灯片的html代码吗?我可以触发第二张幻灯片和连续的幻灯片,但它们不会超时,并且几乎同时被触发。