Bootstrap Timepicker在Angular中获取时间戳的方法

作者：开源拾贝时间：2026-10-22 04:47:35浏览：413

本文介绍在Angular项目中，当无法升级版本时，如何直接获取Bootstrap Timepicker的值并转换为时间戳。通过引入必要的CSS和JS文件，配置HTML输入框，并在JS中利用jQuery获取值，使用Date对象进行格式转换和 getTime 方法计算，最终实现时间戳的获取。

Bootstrap Timepicker在Angular中获取时间戳的方法

上一篇我们讨论了Angular对timepicker的封装插件，但该插件要求Angular版本必须高于v1.2.30。对于某些大型系统，升级Angular版本耗时较长，因此可以采用以下方法直接获取时间值。

页面上的时间格式如下所示：

Bootstrap Timepicker在Angular中获取时间戳的方法

需要引入相关文件。


'/bootstrap-datetimepicker.min.css',
'/bootstrap-datetimepicker.min.js',
'/bootstrap-datetimepicker.zh-CN.js',//中文包

HTML部分代码。


<div class="input-group date form_datetime" data-date-format="yyyy-mm-dd hh:ii:ss" data-link-field="dtp_input1" id="effStartDate"> //设置时间格式为 yyyy-mm-dd hh:ii:ss 。设置ID为 effStartDate
<input class="form-control" size="16" type="text" value="" readonly> 
　　　　<span class="input-group-addon">
　　　　  <span class="glyphicon glyphicon-remove"></span>
    </span> 
    <span class="input-group-addon">
      <span class="glyphicon glyphicon-th"></span>
    </span> 
</div>

JavaScript部分代码。


 var dateFrom = $("#effStartDate input").val();//设置一个ID，取到bootstrap timepicker的值
 $scope.effStartDate=new Date(dateFrom.substring(0,19).replace(/-/g,'/')).getTime()/1000;//转化为时间戳

https://github.com/cynthiawupore

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持本站。

作者最新文章

JS 怎么使用 pako.js 解压 gzip 数据流

2026-11-05 15:54:33

零基础先学JavaScript还是Python？对比学习难度与上手曲线

2026-11-05 14:47:40

JS代码反混淆：主流在线工具与本地软件推荐

2026-11-04 19:28:41

浏览器控制台查看格式化JSON有哪些实用技巧

2026-11-04 16:56:53

JS控制台打印基础：console.log语法与多参数用法

2026-11-04 09:23:11