转自：http://www.cnblogs.com/echo2016/p/5416572.html
http://www.cnblogs.com/pilixiami/p/5611346.html
使用angular框架的时候，之前用的时间控件是引入My97DatePicker组件实现的，但是因为
1.My97DatePicker样式不太好看以及偶尔会出现底部被遮盖的情况、点击不可编辑input框使用backspace按钮会出现格式不符合问题
2.angular-bootstrap 自带兼容第三方ui-date，并且是基于bootstrap改造的
所以决定调研ui-date是否符合产品需求：
条件1.开始时间和结束时间之间有某种关系：开始时间可范围最大值不超过结束时间值，结束时间可选最小值不小于开始时间值
条件2.有选择今天日期按钮
条件3.不能有清除日期按钮
条件4.必须汉化
在引入该文件的时候，angular版本是1.5.0，angular-ui-bootstrap版本是1.1.2，修改代码后为
1 <p class="input-group">
2 input type="text" class="form-control" uib-datepicker-popup readonly ng-model="dicQueryObj.startTime" is-open="startPopupOpened" min-date="minStartDate" max-date="maxStartDate" datepicker-options="dateOptions" ng-required="true" close-text="关闭" current-text="今天"/>
3 span ="input-group-btn"4 button ="button"="btn btn-default" ng-click="startOpen()"><i ="glyphicon glyphicon-calendar"></ibutton5 </span6p>
="dicQueryObj.endTime"="endPopupOpened"="minEndDate"="maxEndDate"="今天" 4 ="endOpen()"
//初始化查询条件
$scope.dicQueryObj = {
fileName: '',
startTime:new Date(CommonServ.getLastMonthDate()),
endTime: new Date(CommonServ.getCurDate()),
order: '0'
};
//时间选择器配置
$scope.minStartDate = 0; //开始时间的最小时间
$scope.maxStartDate = $scope.dicQueryObj.endTime; //开始时间的最大可选时间
$scope.minEndDate = $scope.dicQueryObj.startTime; //结束时间的最小可选时间要大于开始时间的设定值
$scope.maxEndDate = $scope.dicQueryObj.endTime; //结束时间的最大可选择时间不超过结束时间的设定值
$scope.$watch('dicQueryObj.startTime',function(v){
$scope.minEndDate = v;
});
$scope.$watch('dicQueryObj.endTime',function(v){
$scope.maxStartDate = v;
});
$scope.dateOptions = {
formatYear: 'yy',
maxDate: new Date(),
startingDay: 1
};
$scope.startOpen = function() {
$timeout(function() {
$scope.startPopupOpened = true;
});
};
$scope.endOpen = function() {
$timeout(function() {
$scope.endPopupOpened = true;
});
};
$scope.startPopupOpened = false;
$scope.endPopupOpened = false;
/*ui-date样式*/
2 .uib-button-bar .btn-group button[ng-click^="select(null)"] {
3 display: none;
4 }
require('./angular-locale_zh-cn');
module.exports = 'ngLocale';
