如何从 ts for 循环生成离子选择

Question

我是 Ionic 的新手。我想从 ts 文件在 html 文件中生成一个离子选择选项。在下面的代码中，我有一个 for 循环，它执行 7 次并给出 7 个不同的 this.newDate 值。我希望每次循环执行时都会在 html 文件中创建一个 ion-option。

 viewTime(){

       let url = 'http://api.timezonedb.com/v2.1/get-time-zone?key=8304HG08V&format=json&by=zone&zone=Asia/Kolkata';

        this.http.request(url, this.config.options)
        .map(res => res.json())
            .subscribe((response: any) => {
                console.log(response);
                console.log(response.timestamp);

                    var data = response.timestamp - 19800 ;
                      const datePipe = new DatePipe('en-US');
                    const time = datePipe.transform(data*1000, 'h:mm a');

                    //const datePipe = new DatePipe('en-US');
                    const serverDate = datePipe.transform(response.timestamp*1000, 'dd/MM/yyyy');
                    if(time >='16:00 PM'){

                        data = data+172800;

                        console.log("hello")
                    }

                    else{

                            data = data+86400;
                         console.log("exit")

                    }


     this.newDate = datePipe.transform(data*1000, 'dd/MM/yyyy');
        for (var i = 1; i < 8; i++) {

               var value = data+(86400*i);
               this.newDate = datePipe.transform(value*1000, 'dd/MM/yyyy');
          }

                                }, (err) => {
                                let alert = this.alertCtrl.create({
                                title: 'Error',
                                subTitle: 'Please check your credentials',
                                buttons: ['OK']
                                        });
                                 alert.present();
                                 });
                                 }
 }

如何解决？

Answer 1

但是你可以使用类似下面的东西。

sample.ts

export class Sample {

  dates;
  date;

  constructor() {

    this.dates = [];
  }

  viewTime(){

  for (var i = 1; i < 8; i++) {

    var value = data+(86400*i);
    this.newDate = datePipe.transform(value*1000, 'dd/MM/yyyy');
    this.dates.push(this.newDate);

    }
  }
}

sample.html

  <ion-item>
    <ion-label>Select a Date</ion-label>
    <ion-select [(ngModel)]="date">
      <ion-option *ngFor="let date of dates"> {{date}}</ion-option>
    </ion-select>
  </ion-item>

我为你创建了一个working example。