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

Question

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

问题是，当日期选择器初始化时，$scope 变量为空。

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

    });
}

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

此外，promiseStats 看起来像是一个单一的 Promise。您不需要将 $q 注入(inject) Controller 。直接使用你的第一个 promise :

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

或

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