0

Я хочу добавить новую кнопку класса класса в своем datepicker.Как переопределить угловой ui bootstrap datepicker

Пример:

  1. Кнопка синий цвет на дату диапазоне от 8 января 2014 года до 18 января 2014

  2. или, кнопка красного цвета на дату Feb 2, 2014

Я уже пытаюсь установить директиву datepicker, но это не сработает. Здесь мои коды:

angular.module('App').directive('NewDatepickerPopup',function(){ 
return{ 
    restrict: 'EA', 
    replace: true, 
    require: ['datepicker'], 
    templateUrl: 'template/datepicker/datepicker.html', 
    controller: function($scope){ 
     console.log('controller NewDatepickerPopup'); 
    }, 
    link: function(scope, element, attrs, requiredControllers){ 
     console.log('requiredControllers',requiredControllers); 
     console.log('link NewDatepickerPopup'); 
     element.on('click',function(){ 
      console.log('on click nya disini'); 
     }); 
    } 
}; 

});

angular.module("template/datepicker/datepicker.html", []).run(["$templateCache", 
function($templateCache) { 
    $templateCache.put("template/datepicker/datepicker.html", 
     "<table class=\"zor-datepicker\" >\n" + 
     " <thead>\n" + 
     " <tr>\n" + 
     "  <th><button type=\"button\" class=\"btn btn-cal btn-sm pull-left\" ng-click=\"move(-1)\"><i class=\"fa fa-angle-left fa-lg\"></i></button></th>\n" + 
     "  <th colspan=\"{{rows[0].length - 2 + showWeekNumbers}}\"><button type=\"button\" class=\"btn btn-cal btn-sm btn-block\" ng-click=\"toggleMode()\">{{title}}</button></th>\n" + 
     "  <th><button type=\"button\" class=\"btn btn-cal btn-sm pull-right\" ng-click=\"move(1)\"><i class=\"fa fa-angle-right fa-lg\"></i></button></th>\n" + 
     " </tr>\n" + 
     " <tr ng-show=\"labels.length > 0\" class=\"h6\">\n" + 
     "  <th ng-show=\"false\" class=\"text-center ng-hide\">#</th>\n" + 
     "  <th ng-repeat=\"label in labels\" class=\"text-center\">{{label}}</th>\n" + 
     " </tr>\n" + 
     " </thead>\n" + 
     " <tbody>\n" + 
     " <tr ng-repeat=\"row in rows\">\n" + 
     "  <td ng-show=\"false\" class=\"text-center ng-hide\"><em>{{ getWeekNumber(row) }}</em></td>\n" + 
     "  <td ng-repeat=\"dt in row\" class=\"text-center\">\n" + 
     "  <button type=\"button\" style=\"width:100%;\" class=\"btn btn-default btn-sm\" ng-class=\"{'btn-info': dt.selected}\" ng-click=\"select(dt.date)\" ng-disabled=\"dt.disabled\"><span ng-class=\"{'text-muted': dt.secondary}\">{{dt.label}}</span></button>\n" + 
     "  </td>\n" + 
     " </tr>\n" + 
     " </tbody>\n" + 
     "</table>\n" + 
     ""); 
} 

]);

<input id="ph" ng-click="openCheckin($event)" name="in" type="text" class="form-control search home" new-datepicker-popup datepicker-popup="{{format}}" ng-model="check_in" ng-change="changeCheckinDate()" is-open="openedCheckin" min="minCheckInDate" ng-required="false" show-weeks="false" show-button-bar="false" close-text="Close" placeholder=""/>  

Кто-нибудь может мне помочь?

Большое спасибо

* К сожалению мой английский так плохо.

ответ

Смежные вопросы