Ионосборник динамический c массив - PullRequest
0 голосов
/ 15 января 2020

Я хочу получить сборщик ионов с динамическими c опциями в моем приложении, сейчас - stati c, но я не знаю, как это сделать, это всего лишь годовой сборщик, поэтому мне нужен массив, который имеет имя и значение в каждой позиции. Я оставил свой код ниже:

...
import { PickerOptions } from '@ionic/core';
import { PickerController } from '@ionic/angular';

@Component({
  selector: 'app-order-filter',
  templateUrl: './order-filter.page.html',
  styleUrls: ['./order-filter.page.scss'],
})

export class OrderFilterPage implements OnInit {
  framework = '';

  constructor(private pickerCtrl: PickerController) {}

  ...
  async showBasicPicker(){
    let opts: PickerOptions = {
      buttons: [
        {
          text: 'Cancel',
          role: 'cancel'
        },
        {
          text: 'Done'
        }
      ],
      columns: [
        {
          name: 'Year',
          options: [
            { text: '2017', value: '2017'},
            { text: '2018', value: '2018'},
            { text: '2019', value: '2019'}
          ]
        }
      ]
    };
    let picker = await this.pickerCtrl.create(opts);
    picker.present();
    picker.onDidDismiss().then(async data => {
      let col = await picker.getColumn('framework');
      console.log('col: ', col);
      this.framework = col.options[col.selectedIndex].text;
    });
  }
}

1 Ответ

1 голос
/ 16 января 2020

Я думаю, что это должно быть прямо:

  • объявить переменную (свойство) в вашем классе
  • присвоить начальное значение или динамически перед вызовом "create"

также см. Этот пример исходного кода сборщика ионов (не Angular / Ioni c, но тот же принцип), где метод используется для построения как столбцов, так и параметров:

https://github.com/ionic-team/ionic-docs/blob/master/src/demos/api/picker/index.html

Пример:

import { PickerOptions } from '@ionic/core';
import { PickerController } from '@ionic/angular';

@Component({
  selector: 'app-order-filter',
  templateUrl: './order-filter.page.html',
  styleUrls: ['./order-filter.page.scss'],
})

export class OrderFilterPage implements OnInit {

  pickerColumnOptions; // add this variable, assign initial value before creating picker

  framework = '';

  constructor(private pickerCtrl: PickerController) {

    // assign initial value here in constructor or inside ngOnInit hook:
    this.pickerColumnOptions = [
            { text: '2017', value: '2017'},
            { text: '2018', value: '2018'},
            { text: '2019', value: '2019'}
          ]

}

  ...
  async showBasicPicker(){
    let opts: PickerOptions = {
      buttons: [
        {
          text: 'Cancel',
          role: 'cancel'
        },
        {
          text: 'Done'
        }
      ],
      columns: [
        {
          name: 'Year',
          options: this.pickerColumnOptions
        }
      ]
    };
    let picker = await this.pickerCtrl.create(opts);
    picker.present();
    picker.onDidDismiss().then(async data => {
      let col = await picker.getColumn('framework');
      console.log('col: ', col);
      this.framework = col.options[col.selectedIndex].text;
    });
  }
}
...