Question

我正在尝试将一个datepicker（jquery-ui）添加到范围选择器中，但我无法使其工作。

我希望用jquery获得类似这个例子的东西：

$scope.chartConfig = {
        options: {
            chart: {
                zoomType: 'x'
            },
            rangeSelector: {
                enabled: true
            },
            navigator: {
                enabled: true
            }
        },
        series: [],
        title: {
            text: 'Hello'
        },
        useHighStocks: true,
        function (chart) {
            // apply the date pickers
            $timeout(function () {
                $('input.highcharts-input-group').datepicker();
            }, 0);
        }

    }

fiddle with jquery

但完成了角度：

var app = angular.module('myApp', []);

        app.directive('datepicker', function () {
            return {
                restrict: 'C',
                require: 'ngModel',
                 link: function (scope, element, attrs, ngModelCtrl) {
                    $(element).datepicker({
                        dateFormat: 'dd, MM, yy',
                        onSelect: function (date) {
                            scope.date = date;
                            scope.$apply();
                        }
                    });
                }    
            };
        });

        app.controller('myCtrl', function($scope) {
            console.log('it works');
            $scope.count = 0;

            $scope.popdp=function(event){
                console.log('XD')
            event.preventDefault();
                $('.datepicker2').datepicker({
                    dateFormat: 'dd, MM, yy',
                    onSelect: function (date) {
                        scope.date = date;
                        scope.$apply();
                    }
                });
            }
        });

fiddle with angular

毫无疑问jquery-ui datepicker works in angular：

public static void GetProperties<T, V>(this T obj, Func<T, V selector) where T : new()
{

}

Answer 1

我不知道如何以及如何不混合角度和jquery，但您可以查看角度ui-bootstrap库。它有一个可配置的日期选择器。

https://angular-ui.github.io/bootstrap/

并滚动到Datepicker

Answer 2

错误发生在chartConfig结尾处的函数中：

func: function (chart) {
        $timeout(function () {
            $.datepicker.setDefaults({
                    dateFormat: 'yy-mm-dd'
                    });
          //to make the calendar appear at the date that is already in the input
          $('input.highcharts-range-selector').datepicker();
        }, 0);
    }

Datepicker jquery-ui用于angular highcharts-ng rangeSelector

2 个答案: