ionic 2 DatePicker

Question

Ich bin neu in ionischen und ich spiele mit ionischen 2 Beta. Ich versuche, einen nativen Datapicker mit Cordova-Plugin wie in the documentation zu implementieren.

Ich habe das Beispiel vollständig kopieren/einfügen, und ich bekomme "ReferenceError: DatePicker is not defined auf Nexus 5 Emulator und Archos Android-Handy.

openDatePicker() { 
    var options = { 
     date: new Date(), 
     mode: 'date' 
    }; 

    function onSuccess(date) { 
     alert('Selected date: ' + date); 
    } 

    function onError(error) { // Android only 
     alert('Error: ' + error); 
    } 

    DatePicker.show(options, onSuccess, onError); 
    } 

ich gesucht habe viel und fand nichts darüber, vielleicht mit cordova Plugin auf Ionic 2 es mache ich falsch?

Answer 1

Die Dokumentation dazu fehlt (die ionischen Native-Dokumente zum Zeitpunkt dieser Frage sind immer noch sehr ein WIP).

ionic-native ist ein separates Modul aus dem Rahmen, so dass Sie es installieren müssen:

# from within your project directory 
npm install --save ionic-native 

Sie müssen auch das Plugin installieren Sie versuchen, wenn Sie nicht bereits verwenden :

#from within your project directory 
ionic plugin add cordova-plugin-datepicker 

Dann importieren Sie die DatePicker Plugin in Ihrem Code:

import {DatePicker} from 'ionic-native'; 

Und dann wie Ionic 1 können Sie keine Plugins verwenden, bis Cordova bereit ist. Dies bedeutet, dass Sie entweder Platform.ready oder warten, bis das deviceready Ereignis auf window Feuer verwenden:

constructor(platform: Platform) { 
    platform.ready().then(() => { 
    let options = { 
     date: new Date(), 
     mode: 'date' 
    } 

    DatePicker.show(options).then(
     date => { 
     alert('Selected date: ' + date); 
     }, 
     error => { 
     alert('Error: ' + error); 
     } 
    ); 
    }); 
} 

auch eine Sache zu beachten ist, dass ionic-native die Rückrufe in einem Versprechen hüllt.

Answer 2

Try this:

step 1: npm install @ionic-native/core --save 
step 2: npm install --save @ionic-native/date-picker 
step 3: add this plugin to your app.module.ts 
      i. import { DatePicker } from '@ionic-native/date-picker'; 
     ii. providers:[DatePicker] 
step 4: import { DatePicker } from '@ionic-native/date-picker'; 
step 5: Inject in constructor: 
     constructor(public datePicker: DatePicker) { } 
step 6: You can access datePicker like: 
     this.datePicker.show({ 
     date: new Date(), 
      mode: 'date', 
      androidTheme: this.datePicker.ANDROID_THEMES.THEME_HOLO_DARK 
     }).then(
      date => console.log('Date: ', date), 
      err => console.log('Error while getting date: ', err) 
     );