如何使用cordova插件cordova-plugin-inline-datepicker?

时间:2018-11-05 11:10:45

标签: cordova ionic-framework datepicker ionic4

我正在开发一个ionic 4应用程序,并且想要使用cordova插件cordova-plugine-inline-datepicker

而不是本地离子datepicker插件,但出现错误

Uncaught (in promise): TypeError: Cannot read property 'create' of undefined

Impostazioni.ts

import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams,Platform } from 'ionic-angular';
declare var cordova:any;

@IonicPage()
@Component({
selector: 'page-impostazioni',
 templateUrl: 'impostazioni.html',
 })
 export class ImpostazioniPage {
 constructor(private platform: Platform) {

 show(){
 this.platform.ready().then(() => {
  //alert('dentro');
  let element = document.querySelector('.inline-datepicker');
  let options = {
    'mode': 'date',//cordova.plugins.DatePicker.Mode.DATE'', // default is 
  DATE_AND_TIME
    'date': new Date(),
  };
  let success = function (data) {
    // this callback is called everytime input is changed
    //document.querySelector('.date-label').innerText = new 
  Date(data.date).toLocaleDateString();
    alert('success');
  }
  let error = function (data) {
    // this callback is called everytime input is changed
    //document.querySelector('.date-label').innerText = new 
  Date(data.date).toLocaleDateString();
    alert('error: ' + data);
  }


  cordova.plugins.DatePicker.create(element, options,success, error);

    cordova.plugins.DatePicker.show(element, options,success, error);
});
}
}
}

impostazioni.html

<ion-content padding>
<div class="date-label" (click)="show()">No date selected</div>
<div class="inline-datepicker" ></div>
</ion-content>

1 个答案:

答案 0 :(得分:0)

解决方案:我以这种方式安装了插件:

npm i cordova-plugin-inline-datepicker

但正确的方法是:

ionic cordova plugin add cordova-plugin-inline-datepicker

现在,该插件在插件列表中进行比较,并且该错误不再进行比较。