CODEWITHSUNDEEP
angularkendo-uiangular5kendo-angular-ui
user8819437
user8819437

Reputation: 69

kendo ui components are not compatible with Angular 5?

I have a angular 2 application with kendo ui being used in it.

I am trying to upgrade the angular version from 2.4 to 5.

Is kendo ui not compatible with angular 5 version? I searched over and found most recent version is running with angular 4.0 version. the package.json is given below.

package.json 

{
  "name": "dashboard",
  "version": "0.0.0",
  "license": "MIT",
  "scripts": {
    "ng": "ng",
    "start": "ng serve",
    "build": "ng build",
    "test": "ng test",
    "lint": "ng lint",
    "e2e": "ng e2e"
  },
  "private": true,
  "dependencies": {
    "@angular/animations": "5.0.0",
    "@angular/common": "^5.0.0",
    "@angular/core": "^5.0.0",
    "@angular/forms": "^5.0.0",
    "@angular/http": "^5.0.0",
    "@angular/material": "2.0.0-beta.3",
    "@angular/platform-browser": "5.0.0",
    "@angular/platform-browser-dynamic": "2.4.0",
    "@angular/router": "^5.0.0",
    "@progress/kendo-angular-buttons": ""0.20.1"",
    "@progress/kendo-angular-charts": "0.16.1",
    "@progress/kendo-angular-dropdowns": "0.32.0",
    "@progress/kendo-angular-grid": "0.16.2",
    "@progress/kendo-angular-intl": "0.10.0",
    "@progress/kendo-angular-layout": "0.21.4",
    "@progress/kendo-data-query": "0.3.6",
    "@progress/kendo-drawing": "0.13.8",
    "@progress/kendo-theme-default": "2.19.6",
    "@telerik/kendo-theme-default": "1.33.4",
    "@types/moment": "2.13.0",
    "angular2-highcharts": "0.5.5",
    "angular2-tooltip": "^3.1.0",
    "bootstrap": "3.3.7",
    "classlist.js": "^1.1.20150312",
    "core-js": "2.4.1",
    "cytoscape-qtip": "^2.7.1",
    "font-awesome": "4.7.0",
    "fullcalendar": "3.1.0",
    "hammerjs": "2.0.8",
    "intl": "^1.2.5",
    "jquery": "^3.2.1",
    "js-polyfills": "^0.1.34",
    "lodash": "^4.17.4",
    "moment": "2.18.1",
    "ng-lightning": "1.3.0",
    "ng2-bootstrap": "1.4.2",
    "ngx-tooltip": "0.0.9",
    "primeng": "^2.0.0",
    "qtip": "0.0.4",
    "qtip2": "^3.0.3",
    "rxjs": "5.1.0",
    "ts-helpers": "1.1.1",
    "underscore": "1.8.3",
    "web-animations-js": "^2.2.5",
    "xmldom": "^0.1.27",
    "zone.js": "0.7.6"
  },
  "devDependencies": {
    "@angular/cli": "^1.6.3",
    "@angular/compiler-cli": "2.4.0",
    "@types/jasmine": "2.5.38",
    "@types/lodash": "^4.14.50",
    "@types/node": "6.0.68",
    "codelyzer": "2.0.0",
    "jasmine-core": "2.5.2",
    "jasmine-spec-reporter": "3.2.0",
    "karma": "1.4.1",
    "karma-chrome-launcher": "2.0.0",
    "karma-cli": "1.0.1",
    "karma-coverage-istanbul-reporter": "0.2.0",
    "karma-jasmine": "1.1.0",
    "karma-jasmine-html-reporter": "0.2.2",
    "protractor": "5.1.0",
    "ts-node": "2.0.0",
    "tslint": "4.4.2",
    "typescript": "2.4.2"
  }
}

Upvotes: 0

Views: 3759

Answers (4)

Ringo
Ringo

Reputation: 621

I am using Angular 5 and KendoUI is fully compatible!

from the error that I see in the comments below, it looks like you are using an older version of KENDO UI library. OpaqueToken is deprecated in angular 4 and removed in 5, hence the error.

https://github.com/angular/angular/pull/18971

Make sure you grab the latest package from Kendo npm repo.

It would be helpful if you can share with us your package.json so we can see which version of the package you are currently using.

In addition, if you have setup a private registry with KendoUI, make sure to remove it from your npm, as Telerik has step away from it and it will prevent you from getting the latest npm package.

Upvotes: 2

Sangwin Gawande
Sangwin Gawande

Reputation: 8176

Kendo UI is fully compatible with Angular 5. Check this blog post

I have created an application and Installed Kendo UI following steps, adn it is working fine.

commands :

ng new my-angular-kendo --style=scss
cd my-angular-kendo
npm install --save @progress/kendo-angular-buttons @progress/kendo-angular-l10n @angular/animations

package.json :

"dependencies": {
  "@angular/animations": "^5.1.3",
  "@angular/common": "^5.0.0",
  "@angular/compiler": "^5.0.0",
  "@angular/core": "^5.0.0",
  "@angular/forms": "^5.0.0",
  "@angular/http": "^5.0.0",
  "@angular/platform-browser": "^5.0.0",
  "@angular/platform-browser-dynamic": "^5.0.0",
  "@angular/router": "^5.0.0",
  "@progress/kendo-angular-buttons": "^2.0.0",
  "@progress/kendo-angular-l10n": "^1.0.5",
  "core-js": "^2.4.1",
  "rxjs": "^5.5.2",
  "zone.js": "^0.8.14"
},

ScreenShot :

Kendo UI Demo

Upvotes: 2

Shai
Shai

Reputation: 3882

Basically Kendo UI isn't compatible with Angular2+ since they don't communicate with each other. If you implement this communication yourself (using markFor Check and refreshing the Kendo UI component when needed) it should work fine.

I use the Kendo UI Scheduler component and we've advanced from Angular2 to 4 and now wer'e at 5.1.2 and it still works. What problems are you experiencing?

Upvotes: 0

Sandip Jaiswal
Sandip Jaiswal

Reputation: 3730

Yes Kendo UI is not compatible with Angular 5. There is some internal change in Angular 5 which leads to incompatible with Angular 5. Kendo team working on it. I mailed them before a week ago and they told that they are working on it. But they didn't confirmed when they will release.

I will recommend you to stick with Angular 4 and when they will release ANgular 5 compatible version then migrate to ANgular 5. Migration will be easy and may be you don't need to change single line of code during migration. I'm also using Kendo in my project for data-grid, datepicker and combobox. Hope it will help

Upvotes: 0

Related Questions