Визуализация из директивы angularjs через eventRender Fullcalendar

Question

Есть ли способ динамического рендеринга шаблона из директивы angularjs через eventRender Fullcalendar?

Что я хочу достичь, это что-то вроде ниже:

eventRender: function(event, element, view) {

  var template = '<my-directive></my-directive>';

  element.find('.fc-event').append(template);

  scope.$apply();
}

После Документация

Функция обратного вызова eventRender может изменять элемент.

Например, он может изменить свой внешний вид с помощью jQuery's .css ().

В eventRender вставить классы css с помощью

eventRender: function (event, element) {

    element.addClass(event.class)
}

Документация по этой теме не широкая тема.

В нем не приведен пример изменения шаблона с помощью директив Angularjs, а также не указано, есть ли какие-либо ограничения для шаблона, позволяющие обрабатывать его в FullCalendar как событие.

MyCodePen

EDITED_Code_Pen

Answer 1

1 - добавьте $ compile к вашему контроллеру

2 - в eventRender сделайте как показано ниже:

eventRender: function(event, element, view) {


     var compiled = $compile('<div your-directive></div>')($scope);

     element.find('.fc-content').replaceWith(compiled);

 },

workingCodePen