Getting Started with Angular Data Grid using ag-Grid

In this video you will learn how easy it is to get started and make a grid with ag-Grid & AngularJS. You'll see features present in both the free community edition and the enterprise edition.

A data grid is a table of data rendered using div's rather than table elements or a css grid layout.

For more information about ag-Grid & Angular, the code snippets and a running Stackblitz which you can use to follow along, visit our documentation:

Bam's demonstration of ag-Grid and AngularJS:

00:00 Introduction
00:05 How to install Angular using npm
00:17 How to create a new Angular application using ng
00:40 How to run angular app in development web server mode
00:54 How to install ag-Grid open source community edition for Angular
01:16 Adding ag-Grid angular module to source
01:37 Add ag-Grid stylesheet and theme
01:52 Declaring initial grid configurations
02:34 Add component definition to template
03:06 Rendering our first grid
03:17 How to enable sorting and filtering in ag-Grid
05:28 How to add checkboxes to grid to select rows
07:19 How to add grouping to an ag-Grid datagrid (enterprise)
09:19 Outro

For more information about Ag-Grid visit:

[FaizanSaiyed]

I'm adding license key as per the documentation but still getting console error for missing license key

[muzaffarhussain]

[Violation] Added non-passive event listener to a scroll-blocking 'wheel' event. Consider marking event handler as 'passive' to make the page more responsive.
how can resolve it i need help not displaying data

[elyu_vibes]

I really like this agGrid. I hope the server-side pagination and filtering also comes in community version

[МихаилЯненко-щщ]

Can i save grid state and then refresh the page and get saved state back or it`s impossible and i have to use state management for this?

[andythomasdev]

Thanks for the tutorial. Very useful. However, I think the link to the JSON is down or deleted as I can't access it.

[МихаилЯненко-щщ]

How can i add localization in a grid. There are a few information in documentation

[Shivani-qcfy]

How to select the single field value from the grid data so that it can be copied ?

[AlokKumar-exdk]

How to change column definition based on json response from server in ag grid without hard coding the header

[chunckyfreshnut]

Is there a radio button field, or drop down box you can add?

[elyu_vibes]

Can I combine 2 fields for a column? Let's say the backend returns firstname and lastname and I want to be displayed in a single column

[TheGaurav]

style is not being applied for some reasons and there is no error also.

[VijendraSingh-ssmv]

How to use ngx translate to translate ag-grid header dynamically?

[VijendraSingh-ssmv]

How to call cellRenderer component using param function...it just returning string of framework components not the actual component

[AleksandarT]

How to implement pagination from dynamically loaded data?

[rukhsarafroz]

If I have to fetch data from firebase than it's showing loading

[RahulKumar-zrgu]

your video quality is so blurred, that I had to watch in HD quality to understand

[agGrid]

AG Grid is available as a free community edition and commercially as an Enterprise product (full support and more features). AG Grid works with React, Angular, Vue, and JavaScript.

[mychroma]

ag-grid Documentation is difficult and no proper resource to learn