为什么datepicker弹出窗口不显示?

时间:2015-08-14 02:10:03

标签: angularjs twitter-bootstrap datepicker

我正在尝试创建一个bootstrap datapicker指令:

app.directive('datePicker', function ($compile, $timeout) {
    return {
        replace: true,
        restrict:'E',
        templateUrl: 'datepicker.html',
        scope: {},
        controller: function ($scope) {
            console.log('datepciker');

           // debugger;

            $scope.today = function () {
                $scope.dt = new Date();
            };
            $scope.today();

            $scope.clear = function () {
                $scope.dt = null;
            };

            // Disable weekend selection
            //$scope.disabled = function(date, mode) {
            //  return ( mode === 'day' && ( date.getDay() === 0 || date.getDay() === 6 ) );
            //};

            $scope.toggleMin = function () {
                $scope.minDate = $scope.minDate ? null : new Date();
            };
            $scope.toggleMin();


            $scope.open = function ($event) {
                $event.preventDefault();
                $event.stopPropagation();

                $scope.opened = true;
            };

            //$scope.open = function ($event) {
            //    $scope.status.opened = true;
            //};

            $scope.dateOptions = {
                formatYear: 'yy',
                startingDay: 1
            };

            $scope.formats = ['dd-MMMM-yyyy', 'yyyy/MM/dd', 'dd.MM.yyyy', 'shortDate'];
            $scope.format = $scope.formats[0];

            $scope.status = {
                opened: false
            };

            var tomorrow = new Date();
            tomorrow.setDate(tomorrow.getDate() + 1);
            var afterTomorrow = new Date();
            afterTomorrow.setDate(tomorrow.getDate() + 2);
            $scope.events =
                [
                    {
                        date: tomorrow,
                        status: 'full'
                    },
                    {
                        date: afterTomorrow,
                        status: 'partially'
                    }
                ];

            $scope.getDayClass = function (date, mode) {
                if (mode === 'day') {
                    var dayToCheck = new Date(date).setHours(0, 0, 0, 0);

                    for (var i = 0; i < $scope.events.length; i++) {
                        var currentDay = new Date($scope.events[i].date).setHours(0, 0, 0, 0);

                        if (dayToCheck === currentDay) {
                            return $scope.events[i].status;
                        }
                    }
                }

                return '';
            };
        }
    };

在我的页面中,我有:

<date-picker ng-model="dateTo"></date-picker>

出于某种原因,弹出窗口没有出现,有关如何解决此问题的任何建议吗?

plunkr:http://plnkr.co/edit/UiMiEk5GQSVId4YdAnCH?p=preview

0 个答案:

没有答案