Question

我的问题基于on this StackOverflow piece，其中的另一个问题是我从highlight-current-date请求中获取了应用特殊类（例如$http）的日期。

问题是$http请求返回事件的时间太晚，无法应用getDayClass()。因此，例如，如果我来回切换月份，getDayClass()会选择$http请求返回的日期。我考虑使用ng-class代替，但这些类似乎不适用于日历中的各个日期。是什么赋予了？将内容嵌入其中的各种组合也不起作用。

控制器

    $scope.events = [];
    $http({
        url: "getevents.php",
        method: 'POST',
        headers: {
            'Content-Type': 'application/x-www-form-urlencoded'
        },
    }).success(function(data, status, headers, config) {
        if (data !== undefined) {
            $scope.events = data;
        }
    }).error(function(data, status, headers, config) {
        $scope.status = status;
    });

    $scope.getDayClass = function(date) {
        var dayToCheck = new Date(date).setHours(0, 0, 0, 0);
        for (var i = 0; i < $scope.events.length; i++) {
            var currentDay = new Date(Date.parse($scope.events[
                i].date)).setHours(0, 0, 0, 0);
            if (dayToCheck === currentDay) {
                return $scope.events[i].status;
            }
        }
        return '';
    };

UI

<datepicker ng-model="dt" min-date="minDate" 
    show-weeks="true" class="well well-sm" 
    custom-class="getDayClass(date, mode)"></datepicker>

更新：问题是，在加载日期选择器UI（日历）时，会使用日期参数触发getDayClass。如果我实现下面的Sundar提出的解决方案，getDayClass会被正确的事件触发，但是日期变量是未定义的，因此不会分配类。

Answer 1

http请求是异步的。它们不会像其他函数调用一样同步执行。如果你想在http请求之后执行任何需要执行的操作，你需要成功添加或者方法。

更改您的代码，如下所示

$scope.events = [];
    $http({
        url: "getevents.php",
        method: 'POST',
        headers: {
            'Content-Type': 'application/x-www-form-urlencoded'
        },
    }).success(function(data, status, headers, config) {
        if (data !== undefined) {
            $scope.events = data;
            $scope.getDayClass(); //call functions that requires event 
        }
    }).error(function(data, status, headers, config) {
        $scope.status = status;
    });

    $scope.getDayClass = function(date) {
        var dayToCheck = new Date(date).setHours(0, 0, 0, 0);
        for (var i = 0; i < $scope.events.length; i++) {
            var currentDay = new Date(Date.parse($scope.events[
                i].date)).setHours(0, 0, 0, 0);
            if (dayToCheck === currentDay) {
                return $scope.events[i].status;
            }
        }
        return '';
    };

AngularJS datepicker的ng-class vs custom-class

1 个答案: