AngularJs中Bootstrap3 datetimepicker使用实例

关于datetimepicker的使用，参考：//www.jb51.net/article/99896.htm

在AngularJs中使用实例：

HTML代码：

 
 
 
 
 
 
 
 选择日期： 
  
 
 
   
   
   
   
 
 
 
 
 
结果：{{dateOne}}
 
 
 
 
 
 
 
 选择日期+时间： 
  
 
 
   
   
   
   
 
 
 
 
 
结果：{{dateTwo}}
 
 
 
 
 
 

JS代码：

var app = angular.module('myApp', []); 
app.controller('myCtrl', function ($scope) { 
 //在Controller中绑定选择控件 
 var datepicker1 = $('#datetimepicker1').datetimepicker({ 
 format: 'YYYY-MM-DD', 
 locale: moment.locale('zh-cn') 
 }).on('dp.change', function (e) { 
 var result = new moment(e.date).format('YYYY-MM-DD'); 
 $scope.dateOne = result; 
 $scope.$apply(); 
 }); 
 
 $('#datetimepicker2').datetimepicker({ 
 format: 'YYYY年MM月DD日 hh:mm', 
 locale: moment.locale('zh-cn') 
 }).on('dp.change', function (e) { 
 var result = new moment(e.date).format('YYYY年MM月DD日 hh:mm'); 
 $scope.dateTwo= result; 
 $scope.$apply(); 
 }); 
}); 

效果图：

如果大家还想深入学习，可以点击这里进行学习，再为大家附3个精彩的专题：

Bootstrap学习教程

Bootstrap实战教程

Bootstrap Table使用教程

Bootstrap插件使用教程

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