24

Recently, in working with AngularJS, I really like many of the features, like creating custom abstract data factories, etc.

KendoUI also has similar features like MVVM, SPA routes, etc. that AngularJS offers, so I'm curious about what the benefits are of mixing the two (other than the rich UI features of KendoUI)?

-- Update --

I'm asking this question for clarification, and for those who may be slightly confused about the benefits of each, and why one would use both in a project, rather than one over the other.

For example - Javascript unit testing capabilities (simply done with Angular controllers, but have not seen anyone doing this with KendoUI).

It seems like Kendo is trying to do it all, but does UI best.

Thanks.

-- Update --

Since writing this question I have gone through and integrated the KendoUI grid with Angular using OData and have written a tutorial here at www.whatsinyourlunch.com on how to accomplish this, in hopes that this will be useful for others.

The stack is AngularJS, KendoUI, OData, WebAPI2, .Net MVC5, C#, Entity Framework accessed through a generic repository.

ElHaix
  • 12,846
  • 27
  • 115
  • 203

6 Answers6

17

I know this is old but here is my two cents. The more you use Angular the more you will realize you don't need Kendo. The Kendo/Angular integration is a bit of a hack but it seems to get the job done. The only reason I find to use Kendo is the grid. I've tried the Angular grids out there and they are riddled with bugs and formatting issues.

I think it's important not to be a purist and to just use whatever combination of tools that accomplish what you need. I tend to try to move away from being dependent on paid commercial libraries but the grid is just solid. Any paid product will probably have more support and upkeep, as well as personal access to the development team (vs. well maintained free products from large companies or single developer projects that waste away). I have seen so many great free products get abandoned. However, if you want a great free grid and can't stomach paying Telerik $1000.00 for just a grid, DataTables.net is a great alternative and what I currently use.

You have to love Telerik's support which is the best reason to use their stuff in my opinion. They are lacking some things in Kendo like a good date range calendar, tag cloud, etc. The charts are also lacking compared to say Highcharts. I use the date range calendar from Keith Wood, although he doesn't seem to respond to emails. I found some great angular controls for other things like drop downs, etc. as well. I used to not understand why people use a hodge podge of stuff, but it is the best tool for the job that is important.

KingOfHypocrites
  • 9,316
  • 9
  • 47
  • 69
  • 1
    +1 for "The Kendo/Angular integration is a bit of a hack but it seems to get the job done. ". Working on kendo/angular combo in work now and it makes me cry with how awful it is/it has been done in this project by the 3rd party devs. The only pain point is that it works. Maintenance-wise it's a nightmare, but it works. :( – Dan Jun 30 '15 at 10:32
  • 1
    I was using Kendo Grid for two years and in my opinion it is full of bugs if you want to use to much features and customizations. It is not bulletproof more than few good free/cheeper solutions. – Jarosław Kończak Oct 04 '15 at 19:29
7

I personally would not go any further than using the rich UI features of KendoUI in Angular directives. The rest should be Angular. Or use KendoUI exclusively.

meilke
  • 3,280
  • 1
  • 15
  • 31
  • Agree. I tried mixing the two, but end up using only Kendo. Kendo provides great datasource API and MVVM when needed – dakt Feb 17 '14 at 20:24
5

Mixing them works fine. You don't have to use all of the framework code (MVVM, etc.) included with Kendo and can just focus on the rich UI features. We use several of their controls, including a highly customized version of the grid. Angular is perfect for this because we built directives to wrap the Kendo controls and encapsulate the 80% configuration that happens every time so the developer could focus on the 20% that is different in their page/module/whatever. Our project successfully engages over 20 developers in a distributed team on a project with tens of thousands of lines of code and we've had great success using the UI features of Kendo with Angular.

Jeremy Likness
  • 7,531
  • 1
  • 23
  • 25
  • I wonder if introducing Kendo-Angular into the mix is really worth it. I can define a Kendo control then set all its properties (data source, etc.) in an angular controller, for example a grid. The CRUD events can be tied to an OData endpoint (however still no real "Angular" integration). I wanted to abstract out to an Angular CRUD factory, thereby giving JS testability (CI/etc.). Is this architecture recommended or is there a better way - see http://stackoverflow.com/questions/21467130/how-to-setup-curd-with-kendoui-grid-for-use-with-kendo-angular-and-an-angular-od ? – ElHaix Jan 31 '14 at 14:20
  • If OData works then that's probably fine. We had a much more fine-grained need to control the way our domain model is manipulated so OData didn't really cut it, and with the customizations on the client the Angular route was definitely must-have, but it's different for every project. – Jeremy Likness Jan 31 '14 at 14:43
3

On our current project we're using both Angular and Kendo (mainly for the grid). We didn't mix the two and this would also be my suggestion. Angular should be the one responsible for your application logic and Kendo should only be concerned with managing the widgets.

Kendo provides there own kendo-angular library, which contains directives for most of their widgets.

thomaux
  • 19,133
  • 10
  • 76
  • 103
  • Ok, this is the approach that I have been considering. Just wire up all the Kendo controls in the Angular controller, which is what I believe you are saying. With that, would you be able to comment on the following: http://stackoverflow.com/questions/21418110/how-to-get-angularjs-and-kendoui-working-in-harmony ? – ElHaix Jan 29 '14 at 14:34
  • @ElHaix I'll take a look at it later this evening. – thomaux Jan 29 '14 at 15:15
  • @Anzeo By "not mixing" you mean to not let the kendo datasource bindings directly call the backend but rather do it through Angular services (as you normally would)??? I'm currently evaluating whether Kendo is worth it with angular, but I'm a bit concerned about the testability of those components. seeing all the datasource code in the controller looks a bit alarming.. – Juri Sep 09 '14 at 13:31
  • 1
    Correct, we use Kendo purely for the rendering of the widget and the RUI features. Communication with the back end is handled by one Angular service. – thomaux Sep 09 '14 at 16:31
3

Here are a couple of points of my experience which doesn't favor the mixing of KendoUI with AngularJs:

  • Though there are kendo directives for AngularJs, a lot of UI related stuff will end up in the controller (configuration, events, complex templates) and it's difficult to keep jQuery out of it.
  • The initialization and display of kendo components does add a serious time penalty to each page (grid, tabstrip, ...)
  • Events and method arguments are not coherent across the kendo framework (i.e. select method of grid vs listview vs combobox)
  • The use of templates with the grid (or listview) or responding to grid events does not feel like AngularJs.
  • Components behave differently than the native controls they try to replace (i.e. event order and databinding of combobox vs native select)
  • As soon as the look and feel of the kendo components has to be customized, one has to become familiar with the CSS classes used by kendo.

The KendoUI grid is great, but if the project doesn't need it, there's nothing to be gained by mixing the two.

marapet
  • 54,856
  • 12
  • 170
  • 184
1

I think mixing of them is not a good approach. you should ask yourself a question "witch one is more required and useful in my project"

I had decided to use kendo beside angular because of its rich grid components. But I canceled it.

The main controls of kendoUI is grid. But you need to watch every element of it to have a complete binding and it make it slow. Also dataItem of a row in grid does not return the original data. you need to watch paging, filtering , sorting ....

But for other controls of kendo we have fewer problems.

Alborz
  • 6,843
  • 3
  • 22
  • 37
  • 1
    Completely disagree. We use Kendo grid in a custom fashion to show a hierarchical grid that can contain up to a quarter million rows. It implements full paging and expand/collapse of nodes, uses Angular's data-binding and performs very well. We also have paging, filtering, sorting, even custom column. I'm not sure why you ran into issues but it works great for us. – Jeremy Likness Jan 29 '14 at 15:46
  • @Jeremy: I am glad to hear it works fine for you. Also in our experience mixing the two doesn't seem like a great idea. My experiences are 1) A lot more code bloat just to make kendo work 2) UI seems slower 3) kendo seems to have some odd quirks when using it with angular – R. van Twisk Aug 19 '16 at 12:53