使用event.className更改ui日历的事件颜色

Using event.className to change event color for ui-calendar

本文关键字:事件 颜色 日历 ui event className 更改 使用      更新时间:2023-09-26

我是ui日历的新手,在基于条件的代码中设置事件的className属性时遇到一些问题。我还没能找到像这样使用className的例子,但这是我在项目中尝试的:

eventRender: function (event, element) {
    if (event.HighPriority == 1) {
       event.className ='highPriority';
    }
},

在我的css文件中,我有:

.highPriority{
    background-color: red;
    color: white;
}

此行"event.className ='highPriority';"不起作用。有人对angular ui日历做过类似的事情吗?如有任何帮助,我们将不胜感激!

我在GitHub上打开了一个ui日历问题。在vaHuntsMan:的评论之间

eventRender是一个回调。所以你可能正在更改类名太迟了。尝试在创建事件时添加className,然后将其添加到源数组中。

在这个Stack Overflow的帖子中,我能够正确地使用CSS着色。

ui日历设置:

 events: function (start, end, timezone, callback) {
                ...
                $http.get(url).success(function (result) {
                    $scope.myEvents = result.value;
                        for (var i = 0; i < $scope.myEvents.length; i++) {
                              ...
                            if ($scope.myEvents[i].HighPriority) { 
                                $scope.myEvents[i].className = ['highPriority'];
                            }
                        }
                        callback($scope.myEvents);
                })
            },

CSS:

  .highPriority,
  .highPriority div,
  .highPriority span {
    background-color: red; /* background color */
    border-color: white;     /* border color */
    color: white;           /* text color */
  }