DateTime with Ionic 2

Ionic Framework ionic-v3
1

Hi All,

I am trying to make use of the Ionic DateTime component. I have the following code, but nothing displays (just the label and button). If anyone can advise, I would appreciate it.

enter image description here

datetime.html

<ion-header>
  <ion-navbar>
    <ion-title>Last Online</ion-title>
  </ion-navbar>
</ion-header>

<ion-content padding>

  <center>
    <ion-spinner icon="android" *ngIf="loading"></ion-spinner>
  </center>

  <ion-row>
    <ion-col>
      <center>
        <ion-label>Last Online</ion-label>
        <ion-datetime displayFormat="h:mm A" pickerFormat="h mm A" [(ngModel)]="event.timeStarts"></ion-datetime>
      </center>
    </ion-col>
  </ion-row>

  <ion-buttons>
    <button (click)="done()" block round class="form-button-text">{{'Done'}}</button>
  </ion-buttons>

</ion-content>

datetime.ts

import { Component } from '@angular/core';
import { NavController, NavParams, Events } from 'ionic-angular';
import { JobModel } from '../model/jobModel';


@Component({
  templateUrl: 'build/pages/datetime/datetime.html'
})
export class DateTimePage {

  private loading: boolean = true;
  private jobModel: JobModel = null;
  private event: Events = null;

  constructor(private nav: NavController, private navParams: NavParams, event: Events) {
    this.event = event;
    this.jobModel = navParams.get('jobModel');
    if (!this.jobModel) {
      this.jobModel = new JobModel();
    }
    this.loading = false;
  }

  private done(): void {
    alert('todo');
  }
}
2

The following works, it’s a different date picker.