Datechaicker jquery-ui for angular highcharts-ng rangeSelector

我想添加一個datepicker（jquery-ui）到範圍選擇器，但我無法讓它工作。Datechaicker jquery-ui for angular highcharts-ng rangeSelector

我想是這樣的例子使用jQuery：

$.getJSON('https://www.highcharts.com/samples/data/jsonp.php?filename=aapl-c.json&callback=?', function (data) { 
     // Create the chart 
     $('#container').highcharts('StockChart', { 


      rangeSelector : { 
       selected : 1 
      }, 

      title : { 
       text : 'AAPL Stock Price' 
      }, 

      series : [{ 
       name : 'AAPL', 
       data : data, 
       tooltip: { 
        valueDecimals: 2 
       } 
      }] 

     }, function (chart) { 

      // apply the date pickers 
      setTimeout(function() { 
       $('input.highcharts-range-selector').datepicker(); 
      }, 0); 
     }); 
    }); 




});

fiddle with 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 angular

毫無疑問jquery-ui datepicker works in angular：

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(); 
        } 
       }); 
      } 
     });

來源

2016-07-23 gugol

是我函數的錯誤在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); 
    }

來源

2016-07-23 16:15:00 gugol