ion-datetime - set date without datepicker IONIC 3

831 Views Asked by At

I am using with the built-in datepicker to create an event. I would like to be able to dynamically set a date from another page, just like below using NavParams

date selected from the calendar

<ion-datetime #dateTime displayFormat="DD MMM YYYY" pickerFormat="DD MMM YYYY" [(ngModel)]="date" ></ion-datetime>

I have tried as follows:

The AddTaskPage page is displayed from the CalendarPage

1- calendar.ts

 add(){
    this.navCtrl.push(AddTask, {'date': this.selected})
    console.log("AddTask")
  }

2 - add-task.ts I pass the date using NavParams

export class AddTask {

  remindTimes = [10, 30, 60, 120, 160, 1440];
  locations: Location[] = [];
  title:string
  date:any
  selectedDate:string
  reminder:any
  isChecked:boolean = false
  @Output() saveItem = new EventEmitter<any>();
  @ViewChild('dateTime') addDateTime;

  constructor(
    public navCtrl: NavController,
    public navParams: NavParams,
    public popCtrl: PopoverController,
    private dataService: DataServiceProvider
  ) { 
    if(this.navParams.get('date')) {

       this.date =  new Date(this.navParams.get('date'))
       this.selectedDate = moment(this.date).format('DD MMM YYYY');

       console.log(`date selected: ${this.date}`)
       console.log(`date selected: ${this.selectedDate}`)

    } 
  }

3- [(ngModel)]="date"

I am using [(ngModel)] to update the UI (the Start date)

this is not possible to set date unless the date is selected with the datepicker.

Has anyone been able to force the directive to display a date dynamically from an object and not from the datepicker ? Any thoughts?

Thanks

0

There are 0 best solutions below