You will walk away from this workshop being able to do all of these things by yourself.

  • 01. Efficiently render immutable data in AG Grid

    Pairing up NgRx with Angular and NgRx is a perfect match for high-performant rendering of immutable data in AG Grid. You'll learn how to use NgRx and immutable data with AG Grid.

  • 02. Style AG Grid just right

    AG Grid ships with default styling and themes that are well-suited for some application, but it's likely that your organization and users expect a branded experience. You'll learn how to style cells, rows, and create themes for AG Grid that are just right for you.

  • 03. Build a floating filter custom component

    After learning how to register custom framework component with AG Grid, you'll learn the basic interfaces that must be met for building custom components. Then, you'll learn how to build a custom floating filter component with AG Grid and Angular.

  • 04. Build a header custom component

    Next, you'll build a custom header component to display in AG Grid.

  • 05. Build an editor custom component

    Finally, you'll build a custom date editor component. Sure, AG Grid has a date editor, but it's not exactly user friendly since it uses the browser's provided date input. We'll use Angular Material's date picker to build a fancy date editor for AG Grid.

Day One Morning/Afternoon

  1. NgRx + AG Grid for immutable data
    1. Advantages of immutable data
    2. Requirements for implementing immutable data
    3. Implementing immutable data with NgRx
  2. Styling AG Grid
    1. Cell Styling
    2. Row Styling
    3. Theming
  3. Custom Angular Components in AG Grid
    1. Registering components
    2. Component interfaces
    3. Cell renderer component
    4. Floating filter component
    5. Header component
    6. Editor component

Prereqs

Attendees should be familiar with the following technologies:

  • JavaScript and TypeScript.
  • Basics of Angular.
  • Basics of AG Grid.

Can’t find the topic you are looking for? Contact Us  to learn about our custom training solutions.

Get Expert Led Training For Your Team
Schedule Advanced Usage of AG Grid Workshop