This is a migrated thread and some comments may be shown as answers.

Unable to get Kendo UI with Angular integrated into app

4 Answers 71 Views
General Discussions
This is a migrated thread and some comments may be shown as answers.
Jason Maronge
Top achievements
Rank 1
Jason Maronge asked on 05 Nov 2015, 04:18 PM

I have JQuery 2.1.0 and Angular 1.4.0 registered on the page.

I am trying to integrate Kendo in our current app as a POC and I am getting the following error when trying to use the Splitter, although this error looks like it has nothing to do with the splitter.  

 I am using the kendo.all script.

 

Uncaught TypeError: t.register is not a function
(anonymous function) @ kendo.all.min.js:66
(anonymous function) @ kendo.all.min.js:66
(anonymous function) @ kendo.all.min.js:66
(anonymous function) @ kendo.all.min.js:86
(anonymous function) @ kendo.all.min.js:9
(anonymous function) @ kendo.all.min.js:9

 

the t.register it is talking about is,  I am not using angular2 at this time.

t.register("kendo/angular2",["angular2/angular2"]

 

 I have also tried to just use kendo.core, kendo.angular, and kendo.splitter instead of the kendo-all script.  When using these scripts I get the following error:

 

TypeError: d.ui.Resizable is not a function
    at Object.s (https://localhost/ADG.MAP.Web/Scripts/kendo/js/kendo.splitter.min.js:9:577)
    at new g.extend.init (https://localhost/ADG.MAP.Web/Scripts/kendo/js/kendo.splitter.min.js:9:1460)
    at HTMLDivElement.<anonymous> (https://localhost/ADG.MAP.Web/Scripts/kendo/js/kendo.core.min.js:10:3674)
    at Function.jQuery.extend.each (https://localhost/ADG.MAP.Web/scripts/jquery/jquery-2.1.0.js:381:23)
    at jQuery.fn.jQuery.each (https://localhost/ADG.MAP.Web/scripts/jquery/jquery-2.1.0.js:137:17)
    at e.fn.(anonymous function) [as kendoSplitter] (https://localhost/ADG.MAP.Web/Scripts/kendo/js/kendo.core.min.js:10:3651)
    at v (https://localhost/ADG.MAP.Web/Scripts/kendo/js/kendo.angular.min.js:9:433)
    at r (https://localhost/ADG.MAP.Web/Scripts/kendo/js/kendo.angular.min.js:9:1509)
    at link (https://localhost/ADG.MAP.Web/Scripts/kendo/js/kendo.angular.min.js:9:8342)
    at invokeLinkFn (https://localhost/ADG.MAP.Web/scripts/angularjs/angular.js:8604:9) <div kendo-splitter="" style="height:100%;width:100%;border:0;" k-panes="[ {collapsible: false, size: '70%'} ,
                        {collapsible: true, collapsed: true, size: '30%' }]" k-orientation="'vertical'" data-role="splitter" class="k-widget k-splitter">

Using the individual scripts I at least and able to get into the splitter code. 

 Here is the splitter I am trying to create in my app.  http://dojo.telerik.com/@jmaronge/IROyo

Any help would be greatly appreciated.  I need to get this POC done within the next week to present. 

Jason

4 Answers, 1 is accepted

Sort by
0
Jason Maronge
Top achievements
Rank 1
answered on 05 Nov 2015, 04:25 PM
I am using Kendo UI v2015.3.930
0
Jason Maronge
Top achievements
Rank 1
answered on 06 Nov 2015, 03:54 PM

I have created a new app to include very minimal external code that I will need to complete my example and took out all the code in my controller, but still have the same problem.  I have even tried using the Angular and JQuery scripts provided by Telerik.   Don't know if this matters but I am using Angular UI Router in my application.  

 

 

 

0
Jason Maronge
Top achievements
Rank 1
answered on 06 Nov 2015, 08:00 PM

I have finally tracked down what the issue was and need to get some explanation. 

We are using TypeLite to generate some classes, interfaces, and enums that we need to access in JS.  It seems as those exporting the System class is breaking your scripts

 

          
module System {
    export enum d {
    }
}
 
generates
 
var System;
(function (System) {
    (function (d) {
    })(System.d || (System.d = {}));
    var d = System.d;
})(System || (System = {}));

Since I am using the minified script files I can not tell if this namespace is clashing with your namespace somehow.  If so, what can be done about it?  We get System namespace classes generated by TypeLite and can not get rid of them since some of the other classes are relying on them. 

 I can manually get rid of them now because I do not need them on the POC I am doing but we would need to find a fix for this eventually.

 

 

0
Petyo
Telerik team
answered on 09 Nov 2015, 04:13 PM

Hello Jason,

 

the fix for the issue is already present in our subsequent maintenance releases/internal builds.

 

Regards,
Petyo
Telerik
 
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
 
Tags
General Discussions
Asked by
Jason Maronge
Top achievements
Rank 1
Answers by
Jason Maronge
Top achievements
Rank 1
Petyo
Telerik team
Share this question
or