[ANGULAR] eventStyle: 'colored' not working in MonthView

[alexandru_tess]

Ok so:
-parent.html:

<bryntum-calendar
  #calendar
  [date]="currentDate"
  [modes]="calendarConfig.modes"
  [events]="events"
</bryntum-calendar>

-parent.ts:

this.calendarConfig = {
  modes: {
    list: false,
    week: {
      animateTimeShift: false,
      eventLayout: {
        stretch: true,
      },
      autoCreate: false,
      eventRenderer({ eventRecord, renderData }) {
        return `<custom-event-element eventname="${eventRecord.name}"></custom-event-element>`;
      },
    },
  },
};

and in CustomEventElement.ts to add the event listener ? How i pass the calendar instance, because if i provide it as an @Input(), in the CustomEventElement the instance have value "[object, object]"?

[alex.l]

Hi,

in the CustomEventElement the instance have value "[object, object]"

How Custom Element work better to read in official docs, it's not our code. https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_custom_elements
https://stackoverflow.com/questions/55468533/how-to-pass-js-object-and-functions-to-a-web-component

I suggest you to use HTML in renderer in this case, it's much easier in use.

[alexandru_tess]

Ok, but the examples given by you are for js WebComponents not Angular components. It's verry hard for me to use just HTML, I have a lot of logic to write.

[alex.l]

It's up to you, I just found it consistent in the problem you described. If it's more complex, that might worth it.