文档章节

Android版添加phonegap--ionic时间选择插件插件教程

大街小巷
 大街小巷
发布于 2015/12/28 15:26
字数 745
阅读 821
收藏 2

View Demo


介绍:
这是一个ionic-timepicker bower 组件可用于任何ionic框架的应用

先决条件:
(1)node.js、npm、ionic、bower and gulp。

如何使用:
(1)在项目库安装ionic选择器使用的是bower。
 bower install ionic-timepicker--save

(2)在你的index.html文件给ionic-timepicker、bundle.min.js路径。
<!-- path to ionic/angularjs js -->
<script src="lib/ionic-timepicker/dist/ionic-timepicker.bundle.min.js"></script>

(3)在你的应用程序模板的依赖注入ionic-timepicker,为了与ionic-timepicker的时间选择组件。
angular.module('modulename', ['ionic', 'ionic-timepicker']){
}

(4)在模板的相应控制器中使用下面的格式
$scope.timePickerObject = {
 inputEpochTime: ((new Date()).getHours() * 60 * 60),  //Optional
 step: 15,  //Optional
 format: 12,  //Optional
 titleLabel: '12-hour Format',  //Optional
 setLabel: 'Set',  //Optional
 closeLabel: 'Close',  //Optional
 setButtonType: 'button-positive',  //Optional
 closeButtonType: 'button-stable',  //Optional
 callback: function (val) {    //Mandatory
 timePickerCallback(val);
  }
  };
inputEpochTime (Optional) :$scope.timePickerObject的对象,我们需要需要通过指令,此对象的属性如下:
(a)inputEpochTime (Optional):这个输入时间,时间将最初设定,如果你想在按钮上显示的东西,这是强制性的,打开弹出之前。默认值是当前时间。
(b)step (Optional):这是一分钟的增量/减量步骤。默认值15。
(c)format(Optional):此格式的时间。它可以有两个值就是12或者24。默认值为24。
(d)titleLabel (Optional):对弹出式窗口的标题。默认值是时间选择。
(e)setLabel (Optional):用于设置按钮的标签,设置默认值。
(f)closeLabel (Optional):用于关闭按钮的标签。默认值是关闭的。
(g)setButtonType (Optional):这类型的设置按钮。默认值为按钮positive。你可以提供任何有效的ionic框架的按钮类。
(h)closeButtonType (Optional):这类型的关闭按钮。默认值是按钮stable你可以提供任何有效的ionic框架的按钮类。
(i)callback (Mandatory):这个回调函数,它将在控制器中选择时间,你可以定义此功能如下:
function timePickerCallback(val) {
if (typeof (val) === 'undefined') {
console.log('Time not selected');
} else {
var selectedTime = new Date(val * 1000);
console.log('Selected epoch is : ', val, 'and the time is ', selectedTime.getUTCHours(), ':', selectedTime.getUTCMinutes(), 'in UTC');
  }
}

(5)当使用在你的模板/的HTML文件格式
<ionic-timepicker input-obj="timePickerObject">
<button class="button button-block button-positive overflowShow">
<standard-time-meridian etime='timePickerObject.inputEpochTime'></standard-time-meridian>
</button>
</ionic-timepicker>

(a)ionic-timepicker 选择的指令,而我们可以通过要求的。
(b)input-obj (Mandatory):这是一个对象,我们必须通过一个对象如上所示。
standard-time-meridian 是我在这里使用的指令,以显示时间以字符串形式而不是epoch价值。您还可以使用我的任何命令将时间转换为字符串格式。

KeyMob是专业的移动广告,移动广告平台,为应用开发者提供优质渠道合作助力Android、IOS应用交叉推广,通过插屏、全屏、视频广告等展现形式,为广告主提供高效的优化管理。

© 著作权归作者所有

大街小巷
粉丝 8
博文 208
码字总数 130367
作品 0
长沙
私信 提问
Cordova 和 Ionic 的区别

Cordova Apache Cordova是一个开源的移动开发框架。允许你用标准的web技术-HTML5,CSS3和JavaScript做跨平台开发。 应用在每个平台的具体执行被封装了起来,并依靠符合标准的API绑定去访问每个...

华山猛男
2018/11/07
0
0
PhoneGap 插件简介

一、PhoneGap平台 前不久PhoneGap发布了1.0版本,这为移动开发大家族提供了又一个跨平台的解决方案。开发者只要有JavaScript、CSS3、Html5的基础就可以快速开发移动应用,并且一次开发支持i...

无鸯
2011/09/06
6.7K
2
基于PhoneGap的Android应用开发-Get started

PhoneGap是一款开源的手机应用开发平台,它仅仅只用HTML和JavaScript语言就可以制作出能在多个移动设备上运行的应用。 PhoneGap将移动设备本身提供的复杂的API进行了抽象和简化,提供了一系列...

无鸯
2011/09/09
1K
1
【配置环境】Phonegap+android

我用的是cordova2.8.1,之前用了2.9.1版本的,发现没有那个.jar包,果断换成了2.8.1如果用2.9.1以上,则打成jar包就行 版本的,试了下能用,根据下面的步骤就可以了 http://phonegap.com/inst...

JungleKing
2014/03/07
0
0
使用The PhoneGap Developer App实现快速调试项目

如今,基于 PhoneGap 的混合 APP 开发技术更加成熟,优势更加凸显。移动互联网的迅猛发展,Android 和 iOS 的版本快速迭代,使 HTML5 的性能问题逐步解决。仅仅在 PhoneGap 官网上,已经有来...

crazymus
2015/04/26
0
0

没有更多内容

加载失败,请刷新页面

加载更多

Redox OS 发布 0.5 版

Redox OS 是一个几乎完全以 Rust 语言编写的通用操作系统及周围生态(例如文件系统、显示服务器及 Rust 版本的 libc)。其遵循微内核架构,在一定程度上兼容于 POSIX。 该项目于日前发布了 ...

linuxCool
21分钟前
0
0
更新上传git/gitee项目时出现密码配置错误(incorrect username or password)的解决办法

1.输入【git remote add origin git地址】 命令时出现incorrect username or password的错误,这是因为之前弹出输入账户和密码时输错了,而且会一直默认错误的账户和密码,因此需要把之前输入...

west_coast
28分钟前
0
0
Jenkins基础入门-1-Jenkins简单介绍和环境安装

如果在做自动化测试的朋友,应该熟悉Jenkins,或者至少使用过。如果一个人没有使用过Jenkins或者hudson,hudson是Jenkins的前身,他还说自己做过自动化测试,只能说,他只不过是在做半自动化...

shzwork
28分钟前
0
0
linux上解压版安装jdk,tomcat

需要的安装包 1.vmware12 2.centos7版本 3.安装完成后需要xshell来连接远程虚拟机,虚拟机保证要联网,网络畅通。 4.xftp用来向linux传输文件用,一般来说xshell和xftp配套使用 5.对应的压缩...

architect刘源源
今天
26
0
使用 spring 的 IOC 解决程序耦合

工厂模式解耦 在实际开发中我们可以把三层的对象都使用配置文件配置起来,当启动服务器应用加载的时候,让一个类中的方法通过读取配置文件,把这些对象创建出来并存起来。在接下来的使用的时...

骚年锦时
今天
2
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部