title: How to display Date-picker in IONIC 2?
body: <p>I wanted to display the DatePicker as soon as page loads.</p>
  
  <pre><code>&lt;DatePicker
          android:layout_width="match_parent"
          android:layout_height="wrap_content"
          android:id="@+id/datePicker"
          android:layout_gravity="center_horizontal|top"
          android:headerBackground="?attr/colorPrimary"
          android:layout_alignParentTop="true"
          android:layout_alignParentLeft="true"
          android:layout_alignParentStart="true"
          /&gt;
  </code></pre>
  
  <p>I used Android studio and wrote above code to get the output as in the below image.
  <a href="https://i.stack.imgur.com/7yUX2.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/7yUX2.png" alt="Expected Output in ionic"></a></p>
  
  <p>I wanted to implement the same thing using ionic 2 and wrote below code to get the datepicker.</p>
  
  <pre><code>import {Component} from '@angular/core';
  import {DatePicker} from 'ionic-native';
  import {Calendar} from 'ionic-native';
  import {Platform} from 'ionic-angular';
  
  @Component({
    templateUrl: 'build/pages/hello-ionic/hello-ionic.html'
  })
  export class HelloIonicPage {
  
  
  
  constructor(platform: Platform) {
      platform.ready().then(() =&gt; {
        let options = {
          date: new Date(),
          mode: 'date'
        }
  
    DatePicker.show(options).then(
      date =&gt; {
        alert('Selected date: ' + date);
      },
      error =&gt; {
        alert('Error: ' + error);
      }
    );
  });
  
  
  }
  }
  </code></pre>
  
  <p>And im getting the DatePicker as in below image.
  <a href="https://i.stack.imgur.com/Tdv37.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/Tdv37.png" alt="Ionic DatePicker"></a></p>
  
  <p>Now my question is how to get the same DatePicker as in the First image?</p>