Unable to get Kendo UI with Angular integrated into app

[Jason Maronge]

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

[Jason Maronge]

I am using Kendo UI v2015.3.930

[Jason Maronge]

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.  

 

 

 

[Jason Maronge]

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.

 

 

[Petyo]

Hello Jason,

 

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

 

Regards,
Petyo
Telerik