// 1.引入相关的JS和css
// 2.封装指令
/**
* http://www.bootcss.com/p/bootstrap-datetimepicker/
* 时间日期组件
* minView: 2, 设置只能选日期
* format: 格式化日期-> yyyy-mm-dd yyyy-mm-dd hh:ii yyyy-mm-dd hh:ii:ss
* initialDate: 初始化日期
*/
utilModule.directive("gDatetimepicker", function($timeout) {
return {
restrict: 'EA',
scope: {
gFormat: "@",
gOpenTime: "@"
},
link: function($scope,element,attrs) {
if (angular.isUndefined($scope.gOpenTime)) {
$scope.gOpenTime = 'true';
}
// 没有开启时间,并且没有输入格式化
if ($scope.gOpenTime == 'false' && angular.isUndefined($scope.gFormat)) {
$scope.gFormat = "yyyy-mm-dd";
}
if (angular.isUndefined($scope.gFormat)) {
$scope.gFormat = "yyyy-mm-dd hh:ii";
}
$timeout(function(){
$(element).datetimepicker({
language: datetimePickerI18N, // datetimePickerI18N在jspHeader.jsp定义的
weekStart: 1,
todayBtn: 1,
autoclose: 1,
todayHighlight: 1,
startView: 2,
forceParse: 0,
showMeridian: 1,
minView: $scope.gOpenTime == 'false' ? 2 : 0,
autoclose: 1,
format: $scope.gFormat
});
},500);
}
}
});
//3.在页面中使用
<!-- 不开启选择时间 -->
<input type="text" g-datetimepicker g-open-time="false" />
<!-- 开启 -->
<input type="text" g-datetimepicker />