[ANGULAR] Trial Support for Angular 11

[drew]

Hi,

Is the trial version support Angular 11?

	"@bryntum/calendar": "npm:@bryntum/calendar-trial@^6.1.7",
	"@bryntum/calendar-angular": "6.1.7",

I seem to be getting this error when I include the module in my application.

Error: ./node_modules/@bryntum/calendar-angular/fesm2015/bryntum-calendar-angular.js 65:10-28
"export 'ɵɵFactoryTarget' (imported as 'i0') was not found in '@angular/core'

[sergey.maltsev]

Hi!

Yes, we do support legacy Angular versions with a separate package @bryntum/calendar-angular-view.

You may check a note in Angular guide here:
https://bryntum.com/products/calendar/docs/guide/Calendar/integration/angular/guide#ivy-and-view-engine-wrappers

Please check online Angular 11 demo here
https://bryntum.com/products/calendar/examples/frameworks/angular/angular-11

We suggest migration to a newer framework version.

[drew]

Thanks Sergey. Thanks worked!

[brms]

Hi,

Does @bryntum/calendar-angular-view support print() and scrollEventIntoView()?

If so, are there examples?

[ghulam.ghous]

We don't have any example with these features enabled and using angular-11. But it should be working without any issues, you can download this example https://bryntum.com/products/calendar/examples/frameworks/angular/angular-11/dist/angular-11/ and try to enable above mentioned feature and method.

[brms]

I've downloaded the example and followed the examples but getting the following errors:

Property 'print' does not exist on type 'Calendar'.ts(2339)
Property 'scrollEventIntoView' does not exist on type 'Calendar'.ts(2339)

    /**
     * Called after View is initialized
     */
    ngAfterViewInit(): void {
        this.calendar = this.calendarComponent.instance;
        this.eventStore = this.calendar.eventStore;
        this.calendar.print();
        this.calendar.scrollEventIntoView();


    this.http
        .get<CalendarData>('assets/data/data.json')
        .subscribe((value: CalendarData):void => {
            this.resources = value.resources.rows;
            this.events = value.events.rows;
        });
}

https://bryntum.com/products/calendar/docs/api/Calendar/feature/print/Print
https://bryntum.com/products/calendar/docs/api/Scheduler/view/mixin/SchedulerScroll#function-scrollEventIntoView

[tasnim]

Hey,

Do you have print feature enabled? It will only be available if the print feature is enabled.
And scrollEventIntoView is not a calendar method; it's a scheduler method, so it is an invalid calendar method.

You can access the methods that are available in CalendarMixin https://bryntum.com/products/calendar/docs/api/Calendar/widget/mixin/CalendarMixin#function-scrollTo

[brms]

Hi,

Print:

Enabling print feature does not work either:
Object literal may only specify known properties, and 'features' does not exist in type 'BryntumCalendarProps'.ts(2353)

/**
 * Application config file
 */

import { BryntumCalendarProps } from '@bryntum/calendar-angular';

export const calendarProps : BryntumCalendarProps = {

eventTooltipFeature : {
    align : 'l-r'
},

date : new Date(2020, 9, 11),

// Modes are the views available in the Calendar.
// An object is used to configure the view.
modes : {
    year : false
},


// Features named by the properties are included.
// An object is used to configure the feature.
features : {
    print        : true,
    eventTooltip : {
        // Configuration options are passed on to the tooltip instance
        // We want the tooltip's left edge aligned to the right edge of the event if possible.
        align : 'l-r'
    }
}
};

https://bryntum.com/products/calendar/examples/print/

ScrollTo:

I'm still getting this error:
Property 'scrollTo' does not exist on type 'Calendar'.ts(2339)

    /**
     * Called after View is initialized
     */
    ngAfterViewInit(): void {
        this.calendar = this.calendarComponent.instance;
        this.eventStore = this.calendar.eventStore;
        this.calendar.scrollTo();


    this.http
        .get<CalendarData>('assets/data/data.json')
        .subscribe((value: CalendarData):void => {
            this.resources = value.resources.rows;
            this.events = value.events.rows;
        });
}

[marcio]

Hey,

For the print feature, ensure you are enabling it correctly. Please see our Vue guide https://bryntum.com/products/calendar/docs/guide/Calendar/integration/vue/guide#features about how to enable features on the Vue wrapper.

For the scrollTo method, it is indeed part of the CalendarMixin and should be available on the calendar instance. Ensure that your calendar instance is correctly initialized and that you are calling scrollTo on the correct object.

If you continue to face issues, please provide more details or code snippets showing how you are initializing and using the calendar component.

[Animal]

Not on the Calendar instance.

From https://bryntum.com/products/calendar/docs/api/Calendar/view/Calendar

Screenshot 2025-05-22 at 18.01.39.png (103.42 KiB) Viewed 2251 times

So on this: https://bryntum.com/products/calendar/docs/api/Calendar/view/Calendar#property-activeView