Question

我与AngularUI calendar合作。我的任务是使用CSS样式向Calendar cells添加一些数据。

我对此一无所知，因为我是AngularJS的新手。

请帮帮我。

感谢。

我的角色代码

$scope.uiConfig = {
    calendar: {
        height: 500,
        editable: true,
        header: {
            left: '',
            center: 'title',
            right: 'prev next'
        },
        defaultView: 'month'

    }
};

Answer 1

使用 dayRender功能尝试此类工作。您可以使用 cell.html

将html元素添加到日历中

在我的回答中，所有单元格都填充了相同的样式和其他HTML元素。然后您可以使用后端阵列对其进行自定义。

试试这个

$scope.uiConfig = {
    calendar: {
        height: 500,
        editable: true,
        header: {
            left: '',
            center: 'title',
            right: 'prev next'
        },
        defaultView: 'month',
        dayRender: function (date, cell) {
                 $r = $scope.getDateInfo(date);
                if($r){
                   cell.css("background-color", "#e6f7ff"); 
                }
                cell.html('<b>'+$r.amount+'</b>');
            }

    }
};

$scope.getDateInfo = function(date){
    return {
             amount : 50000
            } 

}

您可以为HTML元素添加内嵌样式或类。

在此我使用了另一个函数。请参考我的代码，任何进一步的问题只需发表评论。

fiddle

干杯!!

如何将HTML元素添加到AngularUI日历

1 个答案: