Question

On the demo，我看到当天徘徊时，事件名称被弹出。我一直在搜索文档，但我没有看到任何关于如何实现它的描述。

我认为事件名称将与mouseover一起显示并更改uiConfig中的内容。

任何建议都将不胜感激！

Answer 1

这不是ui-calendar中的内置功能。</ p>

The demo使用tooltip component of UI Bootstrap for Angular来显示活动信息。你需要：

将ui.bootstrap添加到您的模块中：

angular.module('yourAp', ['ui.calendar', 'ui.bootstrap']);

配置日历以显示每个事件的工具提示：

$scope.uiConfig = {
  calendar:{
    // This enables the tooltip for every event
    eventRender: function( event, element, view ) {
        element.attr({'tooltip': event.title,
              'tooltip-append-to-body': true});
        $compile(element)($scope);
    };
  }
};

显然，您可以使用eventRender挂钩添加不同的行为/ UI元素。

从海报编辑

$scope.uiConfig = {
  calendar:{
    eventRender: function( event, element, view ) {
        element.attr({ 
            "tooltip-placement":"top", 
            "uib-tooltip": event.title, 
            "tooltip-append-to-body": true 
        });
        $compile(element)($scope);
    };
  }
};

显然，我的Angular版本和Tooltip的版本不一致。上面的代码解决了这个问题。

angular-ui / ui-calendar：使用鼠标悬停显示事件信息

1 个答案: