經(jīng)常在一些項(xiàng)目里面需要使用datePicker來(lái)選擇日期苗桂，常規(guī)的做法有兩個(gè)一個(gè)是使用bootstrap ui指令，另一個(gè)是使用jquery ui的插件告组，下面這個(gè)是jquery插件的方法煤伟。
1、加載庫(kù)
<script src="jqueryui.js"></script>
<script src="angularjs.js"></script>
<link href="jqueryui.css">
2木缝、加載庫(kù)
<div ng-controller="DatepickerDemoCtrl">
<input id="jqdatepicker" class="form-control col-sm-3" jqdatepicker ng-model="search.Date"/>
</div>
angular
.module("app")
.controller("DatepickerDemoCtrl",["$scope",function($scope){
}])
.directive("jqdatepicker",function(){
return {
restrict:'EA',
require:"?^",
link:function(scope,element,attr,ngModelCon){
$(element).datepicker({
inline: true,
showButtonPanel:true,
currentText:'Today',
closeText:'Clear',
dateFormat: 'yy-mm-dd',
onSelect: function (date) {
scope.$apply(function () {
ngCon.$setViewValue(date);
})
}
})
$.datepicker._gotoToday = function (id) {
var target = $(id);
var inst = this._getInst(target[0]);
if (this._get(inst, 'gotoCurrent') && inst.currentDay) {
inst.selectedDay = inst.currentDay;
inst.drawMonth = inst.selectedMonth = inst.currentMonth;
inst.drawYear = inst.selectedYear = inst.currentYear;
}
else {
var date = new Date();
inst.selectedDay = date.getDate();
inst.drawMonth = inst.selectedMonth = date.getMonth();
inst.drawYear = inst.selectedYear = date.getFullYear();
this._setDateDatepicker(target, date);
this._selectDate(id, this._getDateDatepicker(target));
}
this._notifyChange(inst);
this._adjustDate(target);
};
}
}
})
為什么加<code>$.datepicker._gotoToday</code>便锨，我也不清楚，加上之后我碟，插件才可以運(yùn)行正常放案，正常使用里面的功能。
http://stackoverflow.com/questions/18144142/jquery-ui-datepicker-with-angularjs
http://blog.csdn.net/u010379324/article/details/46729971
下面是一篇文章矫俺，和stackoverflow的講解吱殉。
