突出顯示角度UI中的特定日期DatePicker

我正在使用angular-ui datepicker指令，並需要使用彩色文本呈現某些日期。我已經找到了使用beforeShowDay事件的bootstrap datepicker的例子，但是對於angular-ui datepicker卻找不到任何東西。我相當新的角度和角度，並會很感激任何建議。突出顯示角度UI中的特定日期DatePicker

來源

2014-03-05 user3385445

我想做同樣的事情。你有沒有找到答案？ – Ephraim

這可能是開始的解決方案：http://stackoverflow.com/questions/22865429/angular-ui-bootstrap-current-date-today-highlight-without-selecting – yar1

如果你還是到這一點，我到了這個問題，以及現在和這裏是一個可能的解決方案我想到的輪廓：使用天然氣的處理程序

獲取當前年份和月份-change事件
格式的年份和月份，以便它是在上午12點在本月開始
從數據庫事件（MySQL的類似選擇該月的日子： SELECT DAYOFMONTH(eventDate) FROM eventTable WHERE eventDate >= date AND eventDate <= date + INTERVAL 1 MONTH
通行證這個數組給了一個javascri pt函數並創建一個逆數組，使得當x屬於從步驟3返回的數字（日期）時，day [x]爲true，並且當y是不在數組中的數字時，day [y]爲false。
將數組從步驟4傳遞到datepicker指令（假設存儲爲eventfulDays）
使用ng-class =「{'highlight'：eventfulDays [x] == true}」來突出顯示它。

還沒有嘗試過，但很可能會很快實現它！

來源

2015-01-31 10:05:47 zephinzer

<input type="text" ng-model="startDate" datetime-picker="MM/dd/yyyy" datepicker-options="datepickerOptions" button-bar="false" enable-time="false" is-open="isopen" datepicker-append-to-body="true" />

在日期選擇器選項添加customClass在控制器

datepickerOptions: { 
         customClass: getDayClass, 
         showWeeks: false, 
         startingDay: 1, 
         minDate: new Date(date.getFullYear(), 
         date.getMonth(), date.getDate()) 
        }

呼叫getDayClass（）和在循環中，您可以編寫邏輯來添加類到多個日期，例如：

function getDayClass(data) { 
     var date = data.date, 
     mode = data.mode; 
     if (mode === 'day') { 
      for (var j = 0; j < $scope.dates.length; j++) { 
       var currentTime=moment().valueOf(); 
       var startDate=moment(startDate).valueOf();        
       if(currentTime<startDate){ 
        return 'highlight-current-date' ;//class name 
       } 

      } 
      return ''; 
     } 
    }

添加此課程在您的html裏

<style>.highlight-current-date{ 
    background: LightSkyBlue; 
    } 
</style>

來源

2017-09-18 11:51:28

突出顯示角度UI中的特定日期DatePicker

回答

相關問題