1

I'm using Fullcalendar v5 in angular js, and i'm trying to make a custom event with:

https://fullcalendar.io/docs/content-injection

 eventContent: function(arg) {
   return { html: constructEvent(arg) }
 },

The thing is that if i add:

"<div ng-repeat='user in arg.event._def.extendedProps.users' class='avatar'>"
   "<p>{{ user.name }}</p>"
"</div>"

it won't render. It's like it's outside angular's scope. Can someone tell me if there is a way to construct this with angular js logic? Or i need to use vanilla js to iterate through items. Also ng-click doens't work. I tried even with triggering safeApply digest but no results.

I just want to edit the event inside calendar with the framework i'm using, and use angular events inside it to open sidebars or to make api calls.

Trofin
  • 133
  • 1
  • 7
  • have you tried using `ng-if`? in angularjs, presentation is separated from the logics so the idea is not finding pieces of html in your javascript code – derloopkat Apr 20 '21 at 11:43
  • @DanielManta yes, it seems no angular directive is working inside that event construction from fullcalendar. I'm talking about this event: https://fullcalendar.io/docs/content-injection – Trofin Apr 20 '21 at 12:07

1 Answers1

1

Rendering Events

with your line <div ng-repeat it seems that you'd like to iterate through an array of events to display on your screen. If this is the case, you simply need to render the events via the 'events' parameter. https://fullcalendar.io/docs/event-object

Regarding eventContent (the contents of an event, such as title, subtitle, img, etc)

It looks like at the minute only React JSX Nodes are supported. Vanilla JS is your only way forward. https://fullcalendar.io/docs/content-injection

Jose
  • 370
  • 1
  • 4
  • 14