search envelope-o feed check
Home Unanswered Active Tags New Question
user comment-o

<daypilot-scheduler> is not a known element

Asked by Lara
3 months ago.

Hello,
I am trying to use the scheduler component like this in my angular project:
<daypilot-scheduler [config]="config" [events]="events" #scheduler></daypilot-scheduler>

This is my error message:

'daypilot-scheduler' is not a known element:
1. If 'daypilot-scheduler' is an Angular component, then verify that it is part of this module.
2. If 'daypilot-scheduler' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this message.

I have installed daypilot using the following command:

npm install https://npm.daypilot.org/daypilot-pro-angular/trial/2024.1.5874.tar.gz --save

and I am able to import the following into my .ts file:
import { DayPilotSchedulerComponent, DayPilot } from "daypilot-pro-angular";
With no errors. I am able to use these imports throughout my .ts file but when i use the component in my .html file it does not work.

I have also tried to write the HTML right in the Angular Component Type Decorator like so:
@Component({
  selector: 'scheduler-component',
  template: `
    <daypilot-scheduler [config]="config" [events]="events" #scheduler></daypilot-scheduler>
  `,
  styles: [`
  `]
})

But I still get the same error. How do I use the scheduler component without getting this error?

how-to javascript angular14 angular
Answer posted by Dan Letecky [DayPilot]
3 months ago.

It is necessary to add DayPilotModule to the imports section of the module where you want to use <daypilot-scheduler>.

Example from the Angular Scheduler Quick Start tutorial:

import {DataService} from './data.service';
import {FormsModule} from '@angular/forms';
import {NgModule} from '@angular/core';
import {SchedulerComponent} from './scheduler.component';
import {DayPilotModule} from 'daypilot-pro-angular';
import {HttpClientModule} from '@angular/common/http';
import {CommonModule} from "@angular/common";

@NgModule({
  imports:      [
    CommonModule,
    FormsModule,
    HttpClientModule,
    DayPilotModule
  ],
  declarations: [
    SchedulerComponent
  ],
  exports:      [ SchedulerComponent ],
  providers:    [ DataService ]
})
export class SchedulerModule { }
This question is more than 1 months old and has been closed. Please create a new question if you have anything to add.
Tools
E-mail notifications
Feed
Related Questions
Error while compiling angular2 project using AOT compiler " StaticSymbols in summaries can't have members!".
Displaying total hours when adding or editing shifts in daypilot scheduler control
Property 'makeDraggable' does not exist on type 'typeof Calendar'.
Changing resources property doesn't update in the frozen rows
How use Scheduler component on html component
How to format timeheader "Week"
Bubble configuration with Angular 2+
How to use angular component in bubble HTML
ERROR Error: DayPilot.Scheduler: The placeholder element not found: 'dp_158159830263098078'.
Disable right click on DayPilot Scheduler
Scroll to particular hour of day
Event handling method
OnEventMove waiting on modal response -- cancel response breaks scheduler
Angular 2 scheduler loaded in a dynamic component

Products

Learn

Get Support

DayPilot Pro

Event calendar/scheduling AJAX components. Available for JavaScript/HTML5/jQuery, ASP.NET, ASP.NET MVC. Build resource booking, project management, time tracking applications, personal and shared event calendars.