'daypilot-calendar' is not a known element

Asked by Alex
6 years ago.

Hello,

I am trying to use DayPilot with Ionic framework using WebStorm IDE.

Even if I copy-paste Dan's code to "app.html" from here https://forums.daypilot.org/Topic.aspx/3170/directive-not-working , I receive the following error (in the browser console):

polyfills.js:3 Unhandled Promise rejection: Template parse errors:
'daypilot-calendar' is not a known element:
1. If 'daypilot-calendar' is an Angular component, then verify that it is part of this module.
2. If 'daypilot-calendar' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this message.

I don't know how else I can define the calendar in the module, or what shall I write in "app.module.ts" to import it.

I will be thankful for any help.

Answer posted by Dan Letecky [DayPilot]
6 years ago.

Both sources - the article (http://code.daypilot.org/63034/angularjs-event-calendar-open-source) and the forum topic (https://forums.daypilot.org/Topic.aspx/3170/directive-not-working) use AngularJS 1.x.

However, your project uses Angular 2+ which uses a different infrastructure.

You can take a look at the following quick start project that uses the minimum setup needed for Angular 2:
https://code.daypilot.org/62826/angular-4-calendar-quick-start-project

In short, you need to follow these steps:

1. Install daypilot-pro-angular package from npm.daypilot.org as a dependency
2. Import DayPilotModule in your module (it can be done in app.module.ts but usually you'll want to encapsulate the calendar in a standalone internal module like in the quick start project).
3. Insert the <daypilot-calendar> tag into your template (e.g. app.component.html).

This question is more than 1 months old and has been closed. Please create a new question if you have anything to add.

'daypilot-calendar' is not a known element

Products

Learn

Get Support

DayPilot Pro