CODEWITHSUNDEEP
angulartypescriptbryntum-scheduler
BennoDual
BennoDual

Reputation: 6269

Why do I get the error Type 'undefined' is not assignable to type ...?

I have created a new angular application.

In the app.component.html I have

<bryntum-scheduler
    #scheduler
    [resources] = "resources"
    [events] = "events"
    [columns] = "schedulerConfig.columns"
    [startDate] = "schedulerConfig.startDate!"
    [endDate] = "schedulerConfig.endDate!"
></bryntum-scheduler>

the app.component.ts looks like

import { Component, ViewChild } from '@angular/core';
import { BryntumSchedulerComponent } from '@bryntum/scheduler-angular';
import { schedulerConfig } from './app.config';

@Component({
    selector    : 'app-root',
    templateUrl : './app.component.html',
    styleUrls   : ['./app.component.scss']
})
export class AppComponent {
    resources = [
        { id : 1, name : 'Dan Stevenson' },
        { id : 2, name : 'Talisha Babin' }
    ];

    events = [
        { resourceId : 1, startDate : '2022-01-01', endDate : '2022-01-10' },
        { resourceId : 2, startDate : '2022-01-02', endDate : '2022-01-09' }
    ];

    schedulerConfig = schedulerConfig;

    @ViewChild('scheduler') schedulerComponent!: BryntumSchedulerComponent;
}

and this is the app.config.ts (in the same folder as app.component.ts):

import { SchedulerConfig } from '@bryntum/scheduler';

export const schedulerConfig: Partial<SchedulerConfig> = {
    columns : [
        { text : 'Name', field : 'name', width : 160 }
    ],
    startDate : new Date(2022, 10, 17),
    endDate   : new Date(2022, 10, 23)
};

When I try to compile my app, I get the error

Type 'undefined' is not assignable to type 'object | object[] | ColumnStore | Partial | Partial[]'.

5 [columns] = "schedulerConfig.columns"

I do not seen the cause of this error. Can someone help me?

Upvotes: 0

Views: 179

Answers (1)

Andres2142
Andres2142

Reputation: 2907

Based on the official docs, ColumnStore has many properties, some of them you have defined (text, field, width), so you could "soft" cast columns to ColumnStore when passing to this component like so:

<bryntum-scheduler
    #scheduler
    [resources] = "resources"
    [events] = "events"
    [columns] = "schedulerConfig.columns as ColumnStore" <!--here-->
    [startDate] = "schedulerConfig.startDate!"
    [endDate] = "schedulerConfig.endDate!"
></bryntum-scheduler>

Upvotes: 0

Related Questions