Kendo UI Developing with AngularJS?
HTML5 and JavaScript framework Kendo UI saves you development time
with 70+ UI widgets built with AngularJS in mind
Build AngularJS Applications in
Half the Time
AngularJS is one of the most popular JavaScript frameworks today as it enables developers to quickly build properly architectured apps. What it brings to the table that other frameworks don't is convenient code separation, declarative databinding and routing, components creation, form validation, event management and many more.
Although it gives you a great foundation, AngularJS doesn't provide advanced UI out of the box. If you're building professional HTML5 applications under tight deadlines and budget, you either need to build the UI yourself or turn to a third-party library. In both cases there's loss of productivity - you either build everything from scratch or you have to make that third-party UI wire up to AngularJS.
Telerik HTML5 and JavaScript Kendo UI framework was built with AngularJS in mind to help you cut development time and cost. It provides 70+ UI widgets, ranging from the must haves for every app Grid, Charts and Menus, to the advanced and business-grade UIs like Map, Gantt, Diagram and more. What's more, all of these widgets include built-in AngularJS directives support, so all you have to think about is the business logic of your app.
Today Kendo UI supports AngularJS 1.x and Angular 2 Alpha releases. We are working on supporting Angular 2.
Kendo UI
Integrates Seamlessly with AngularJS
How Kendo UI Saves You Time
The Kendo UI? framework provides everything you need to integrate with AngularJS out of the box—bindings, component configuration, directives, template directives, form validation, event handlers, etc. All you have to do is include the proper Kendo UI libraries into your project.
Yet, Kendo UI tooling does not depend on AngularJS. Use it with AngularJS or not; it’s totally up to you. We’ve taken care to make this integration seamless and easy.
AngularJS Directives
Directives enable Angular to bring additional functionality to HTML. Imagine a world where HTML has so many rich elements (for example <accordion></accordion>, <lightbox></lightbox>, etc.) that we never have to manipulate the DOM to simulate them. All you need to do is assign directives to elements to get rich functionality out of the box.
Because of the built-in directives support, creating a Kendo UI widget in an AngularJS application requires a single line of code - the widget's directive. For example, providing the “kendo-date-picker” directive on an <input> element will tell the AngularJS HTML compiler to create a Kendo UI date picker widget:
<label>Birthday: <input kendo-date-picker /></label>
You can define all options supported by Kendo UI components by adding the needed attributes. In the case of the date picker these could be minimum and maximum date, navigation depth, etc.
Template Directives
Kendo UI templating engine lets you render client-side templates with Javascript. You can insert HTML markup that can be automatically merged with Javascript data.
You can set Kendo UI templates by using nested AngularJS directives (i.e. <div k-template> </div>)
Form Validation
Client-side form validation makes apps more responsive and improves the overall user experience. Traditionally, you would do this through JavaScript logic, while AngularJS lets you declare the validation rules without having to write JavaScript code
AngularJS Support in Complex Widgets
Grid
Adding flexible data visualization and manipulation functionality to your AngularJS applications is easy with the Kendo UI Grid widget. It comes with 100+ built-in features, including everything from paging, sorting, filtering and data editing to grouping and hierarchy. You can have it up and running in minutes.
Chart
With just a few lines of code you can enable users to analyze and drill down into data in a variety of visual formats, including pie, line, bar, candlestick, sparklines, funnel and more.