如何将角度指令添加到完整的日历事件 [英] How to add angular directive to full calendar event

问题描述

我正在使用Angular-UI日历​​(Arshaw的fullcalendar的Angular版本)，并且在EventRender上，我想将Angular-UI-bootstrap popover添加到event元素.

I'm using Angular-UI Calendar (angular version of Arshaw's fullcalendar) and on EventRender I would like to add a Angular-UI-bootstrap popover to the event element.

我已经尝试过这些(使用coffeescript):

I have tried these (using coffeescript):

    eventRender: (event, element) ->
        element.find(".fc-event-inner").wrap("<div popover='I appeared on mouse enter!' popover-title='The title.' popover-trigger='mouseenter'></div>")

和

    eventRender: (event, element) ->
        element.find(".fc-event-inner").wrap($compile("<div popover='I appeared on mouse enter!' popover-title='The title.' popover-trigger='mouseenter'></div>")($scope))
        $scope.$apply()

但这些似乎都没有做任何事情.我想至少第一个问题是事件是在角度完成后渲染的，这已经是不可思议的了.但是第二个也没有帮助.使用一些静态元素，弹出框可以正常工作.

But neither of those seem to be doing anything. I guess the problem with first one at least is that the event is rendered after angular has done it's magic already. But the second one didn't help either. With some static element the popover is working correctly.

推荐答案

使其正常工作:)

eventRender: (event, element) ->
    element.attr('popover', "Finally it's working")
    element.attr('popover-title', 'Hello world')
    element.attr('popover-trigger', 'mouseenter')
    $compile(element)($scope)

这篇关于如何将角度指令添加到完整的日历事件的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！