Question

我面临的问题是我创建了一个日期选择器，我想根据我从json收集的日期设置其最小日期和最长日期。

问题是，在初始化datepicker时，$ scope变量为null。

$scope.dates = [];
$scope.stats = {};
$scope.latestDay;
$scope.startDay;

$controller('rightsController', {
    $scope : $scope
});

init();

$("#datepick").datepicker({
    changeMonth: true,
    changeYear: true,
    buttonImageOnly: true,
    dateFormat: 'dd/mm/yy',
    minDate: ''+$scope.startDay,
    maxDate: ''+$scope.latestDay
});

function init() {
    fetchHourlyStats0();
}

$scope.fetchComparativeStats = function() {
    fetchHourlyStats0();
}

function fetchHourlyStats0() {
    var promiseStats = statsFactory.getHourlyStats();
    $q.all([ promiseStats ]).then(function(values) {
       $scope.stats = values[0].data;
       i = 0;
       for ( var k in $scope.stats) {
           $scope.dates[i] = k;
           var v = $scope.stats[k];
           i++;
       }
       var length = $scope.dates.length-1;
       $scope.latestDay = $scope.dates[0];
       $scope.startDay = $scope.dates[length];
    })
}

是否可以在创建数据访问对象后以及填充变量后创建日期选择器？

Answer 1

首先，我真的建议你停止混合Jquery和Angular。看一下这个主题："Thinking in AngularJS" if I have a jQuery background? 我认为你很难将jquery设置的值设置到你的选择器中。

但是，现在这不是你的问题。

function fetchHourlyStats0() {
    var promiseStats = statsFactory.getHourlyStats();
    $q.all([ promiseStats ]).then(function(values) {
       // code removed
       $scope.latestDay = $scope.dates[0];
       $scope.startDay = $scope.dates[length];

       $("#datepick").datepicker({
            changeMonth: true,
            changeYear: true,
            buttonImageOnly: true,
            dateFormat: 'dd/mm/yy',
            minDate: ''+$scope.startDay,
            maxDate: ''+$scope.latestDay
        });

    });
}

您只需在承诺的.then()内运行您的jquery代码，即可推迟创建日期选择器。

此外，promiseStats看起来像是一个承诺。您不需要将$q注入控制器。直接使用你的第一个承诺：

statsFactory.getHourlyStats().then(function(values){
    //
});

或

var promiseStats = statsFactory.getHourlyStats();
promiseStats.then(function(values){
   //
});

使用$ scope变量设置Datepicker min / maxDates

1 个答案: