All Components

Troubleshooting

This article provides solutions for issues you might encounter while working with the Kendo UI suite for Angular.

Installation

I cannot install the latest versions of Kendo UI packages for Angular

Due to recurring issues with the initial privately-scoped Progress registry, all Kendo UI packages for Angular are now being published on the public https://www.npmjs.com/~progress registry. For more information, refer to issue/712.

Solution

  1. In your .npmrc file, remove the following lines:

    @progress:registry=https://registry.npm.telerik.com/
    //registry.npm.telerik.com/:_authToken=<token>
  2. If present, remove package-lock.json to clear the stored package locations.

When I try to load a Kendo UI component for Angular, a runtime error occurs that the component is not recognized

The error message that occurs might be similar to Can't bind to '[property-name]' since it isn't a known property of 'kendo-[component-name]'.

The reason for this issue is either that the Kendo UI component module:

  • Is not imported in the module where it is declared and intended to be used, or
  • Is not re-exported from a SharedModule which declares the component in which the Kendo UI component for Angular is used.

Solution

Depending on the scenario of your project, either:

  1. Import the Kendo UI component module in the same module where it is declared and intended to be used, or
  2. Re-export the Kendo UI component module from [YourCustom]Module, which imports the Kendo UI module for Angular.

For more information on a real use case issue, refer to this Telerik forum thread.

For more information on how to handle Angular modules, refer to the:

For more information on how to implement Angular Forms by using Kendo UI form components, refer to the:

The error message that occurs might be similar to:

ERROR in ./$$_gendir/~/@progress/kendo-angular-popup/dist/es/popup.component.ngfactory.ts
    Module parse failed: C:\[user-specific path]\$$_gendir\node_modules\@progress\kendo-angular-popup\dist\es\popup.component.ngfactory.ts Unexpected token (17:27)
    You may need an appropriate loader to handle this file type.
    | import * as i6 from '@progress/kendo-angular-popup/dist/es/services/resize.service';
    | import * as i7 from '@progress/kendo-angular-popup/dist/es/services/scrollable.service';
    | const styles_PopupComponent:any[] = ([] as any[]);
    | export const RenderType_PopupComponent:i0.RendererType2 = i0.╔Ácrt({encapsulation:2,
    |     styles:styles_PopupComponent,data:{'animation':[{type:7,name:'toggle',definitions:[{type:1,
     @ ./$$_gendir/ClientApp/app/app.module.browser.ngfactory.ts 10:0-118
     @ ./ClientApp/boot.browser.ts

The reason for this issue is that the JavaScriptServices team erroneously assume that the Angular components in the .NET Core template are present in the ClientApp folder only. As a result, the publishing process fails when Webpack encounters such code elsewhere.

Solution

To solve this issue, either:

My Plunker no longer works

The reason that a Plunker example does not load might be that the SystemJS configuration was updated. The systemjs.config.js file requires regular modifications to reflect changes in the dependencies of the suite.

The online demos on the website provide the latest working SystemJS configuration.

Solution

To solve this issue:

  1. Open an online demo from the Kendo UI documentation website for Angular.
  2. Copy the content of its systemjs.config.js configuration file.
  3. Paste it over the content in the systemjs.config.js configuration file of the demo that is not working.

Export

I cannot export my component to PDF on mobile devices with iOS Safari browser

The PDF Export module does not claim to support mobile browsers and exports may fail completely or be partially broken.

The reason for this issue is that the iOS Safari browser does not support the download attribute. As a result, the file is generated, but cannot be saved.

Solution

Set up the server-side proxy.

In this article