Ionic 2，日期选择器（cordova插件）。类型“ typeof DatePicker”上不存在属性“ ANDROID_THEMES” [英] Ionic 2, Date Picker (cordova plugin). Property 'ANDROID_THEMES' does not exist on type 'typeof DatePicker'

问题描述

我已经在项目中安装了插件日期选择器。 / p>

在一个组件中，如果从上面使用 native 导入 import {DataPicker}， （带有androidTheme参数的注释）可以正常工作：

  let options = {
 date ：new Date（），
模式：'date'，
 // androidTheme：DatePicker.ANDROID_THEMES.THEME_HOLO_LIGHT 
}; 
 
 DatePicker.show（options）.then（
（date）=> {
 console.log（'date_value：'+ date）
}）。 catch（（错误）=> {}）; 
  

如果我取消注释 androidTheme：DatePicker.ANDROID_THEMES.THEME_HOLO_LIGHT ，它将在构建过程中引发错误：

类型'typeof DatePicker'上不存在属性'ANDROID_THEMES'

我在CLI中在项目文件夹中的 npm安装ionic-native 中是在此处进行了建议，但此操作无法解决问题。它给了我以下输出（对我来说似乎不错）：

`-ionic-native@2.0.3

npm WARN可选跳过失败的可选依赖项/ chokidar / fsevents：

npm WARN notsup与您的操作系统或体系结构不兼容： fsevents@1.0.15

当我在下看时[我的项目] \插件\cordova-plugin -datepicker\www ，它包含与3个平台（ios，android，windows）相对应的3个文件夹，每个文件夹都有一个名为 DatePicker.js的JS文件，而在android文件夹下面的文件夹中在代码中：

  / ** 
 * Android主题
 * / 
 DatePicker。 prototype.ANDROID_THEMES = {
 THEME_TRADITIONAL：1，//默认
 THEME_HOLO_DARK：2，
 THEME_HOLO_LIGHT：3，
 THEME_DEVICE_DEFAULT_DARK：4，
 THEME_DEVICE_DEFAULT_LIGHT：5 
 b}; 
  

如果我查看 [我的项目] \nodes_modules\ionic- native\dist\plugins\ ，文件 datepicker.js 存在（当然），但不包含每个平台的特殊性。

怎么了？为什么在下的 datepicker.js [我的项目] \nodes_modules\ionic-native\dist\plugins\ 并没有包含每个平台的特殊性？

解决方案

我找到了解决方法为此：

在[我的项目] \nodes_modules\ionic-native\dist\plugins [android | ios | windows] \datepicker.js

在代码末尾将其写为：

  var datePicker =新的DatePicker（）; 
 module.exports = datePicker; 
 
 //使插件在window.plugins下工作
 if（！window.plugins）{
 window.plugins = {}; 
} 
 if（！window.plugins.datePicker）{
 window.plugins.datePicker = datePicker; 
} 
  

因此，它使datePicker（以小写开头）不同于DatePicker（以小写开头）

在我需要的组件中，我只是在组件之前声明：

 声明var datePicker：任何; 
  

然后在该组件中，我用以下代码更改了代码：

  let options = {
 date：new Date（），
 mode：'date'，
 androidTheme：datePicker.ANDROID_THEMES。 THEME_HOLO_LIGHT 
}; 
 
 DatePicker.show（options）.then（
（date）=> {
 console.log（'date_value：'+ date）
}）。 catch（（错误）=> {}）; 
  

有效。

I have installed the plugin Date Picker in my project.

In a component wich has import { DataPicker } from 'ionic-native' on top, if I use it like that (with androidTheme parameter commented) it WORKS:

  let options = {
      date: new Date(),
      mode: 'date',
      // androidTheme: DatePicker.ANDROID_THEMES.THEME_HOLO_LIGHT
  };

    DatePicker.show(options).then(
      (date) => {
      console.log('date_value:' + date)
  }).catch( (error) => { });

If I uncomment androidTheme:DatePicker.ANDROID_THEMES.THEME_HOLO_LIGHT, It will bug during the building process throwing:

Property 'ANDROID_THEMES' does not exist on type 'typeof DatePicker'

I did a npm install ionic-native in CLI in my project folder as advised here but it did not fix the problem. It gives me the following output (that seems ok to me):

`-- ionic-native@2.0.3

npm WARN optional Skipping failed optional dependency /chokidar/fsevents:

npm WARN notsup Not compatible with your operating system or architecture: fsevents@1.0.15

When I look under [my project]\plugins\cordova-plugin-datepicker\www, it contains 3 folders corresponding to the 3 platforms (ios, android, windows) with each a JS file named 'DatePicker.js' and in the one below the android folder it contains in the code:

/**
 * Android themes
 */
DatePicker.prototype.ANDROID_THEMES = {
  THEME_TRADITIONAL          : 1, // default
  THEME_HOLO_DARK            : 2,
  THEME_HOLO_LIGHT           : 3,
  THEME_DEVICE_DEFAULT_DARK  : 4,
  THEME_DEVICE_DEFAULT_LIGHT : 5
};

If I look in [my project]\nodes_modules\ionic-native\dist\plugins\ , the file datepicker.js exists (of course) but does not contain the particularities of each platform.

What's wrong? Why datepicker.js under [my project]\nodes_modules\ionic-native\dist\plugins\ does not contain the particularity of each platform despite the plugin was added to the project?

解决方案

I've found a work around for it:

in [my project]\nodes_modules\ionic-native\dist\plugins[android|ios|windows]\datepicker.js

At the end of the code it is written:

var datePicker = new DatePicker();
module.exports = datePicker;

// Make plugin work under window.plugins
if (!window.plugins) {
    window.plugins = {};
}
if (!window.plugins.datePicker) {
    window.plugins.datePicker = datePicker;
}

Hence, it makes datePicker (starting with lower case) different from DatePicker (starting with upper case from ionic-native).

In the component where I required it, I've just declare before the component:

declare var datePicker: any;

Then inside that component I've changed my code with:

 let options = {
      date: new Date(),
      mode: 'date',
      androidTheme: datePicker.ANDROID_THEMES.THEME_HOLO_LIGHT
  };

    DatePicker.show(options).then(
      (date) => {
      console.log('date_value:' + date)
  }).catch( (error) => { });

It works.

这篇关于Ionic 2，日期选择器（cordova插件）。类型“ typeof DatePicker”上不存在属性“ ANDROID_THEMES”的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！