Skip to content

Explore these five Angular examples crafted with Ignite UI for Angular. From data grids to high-performance charts – you can explore them all, see how it’s done, and learn best practices.

Notifications You must be signed in to change notification settings

IgniteUI/angular-grid-examples

Repository files navigation

Ignite UI for Angular Examples

You can quick-start your project using the sample apps here! Explore, inspect the source code, or customize them with ease.
Browse samples and source code

All sample apps are built using Ignite UI’s fast-performance Angular grids for real-time data handling, high-speed rendering, and versatile customization options. Each demonstrates key enterprise-ready features—like sorting, filtering, editing, and more—helping you build interactive, data-rich Angular applications faster.

Financial Portfolio App

Angular Financial Portfolio App

Description:
An Angular example app showing assets, profit, and loss analyses. It integrates dynamic charts, uses a Bootstrap light theme for visual consistency, and features a high-performance Data Grid.

Components Used:

  • Data Grid
  • Avatar
  • Button
  • Icon
  • Linear Bar
  • Input Group
  • Excel Exporter Service
  • CSV Exporter Service

Features:

  • Row Selection
  • Sorting
  • Column Hiding
  • Column Pinning
  • Exporting
  • Conditional Cell Styling
  • Filtering

ERP/Inventory

Angular ERP/Inventory example

Description:
An Angular sample app for ERP/Inventory, handling large data volumes using Ignite UI for Angular Hierarchical Grid with Material Light theme.

Components Used:

  • Hierarchical Grid
  • Data Chart
  • Rating
  • Dialog
  • Badge
  • Button
  • Icon
  • Excel Exporter Service
  • CSV Exporter Service

Features:

  • Row Selection
  • Sorting
  • Filtering
  • Column Moving
  • Column Hiding
  • Column Pinning
  • Exporting

Org Chart/HR Portal

Angular HR Portal Example App

Description:
Angular sample app featuring a Tree Grid to manage and display employee information.

Components Used:

  • Tree Grid
  • Avatar
  • Button
  • Icon
  • Paginator
  • Excel Exporter Service
  • CSV Exporter Service

Features:

  • Row Selection
  • Sorting
  • Excel Style Filtering
  • Column Hiding
  • Column Pinning
  • Exporting
  • Paging

Fleet Management System

Angular Fleet Management System Example

Description:
Angular sample app with a Master-Detail Grid for managing vehicle acquisition, operations, and maintenance—perfect for retail businesses. Includes product-specific details (engine, maker, fuel, trip history, maintenance, etc.).

Components Used:

  • Grid
  • Pie Chart
  • Category Chart
  • Card
  • Geographic Map
  • Overlay
  • Avatar
  • Badge
  • Tabs
  • Carousel
  • Slide
  • Divider
  • Select
  • Button
  • Icon
  • Excel Exporter Service
  • CSV Exporter Service

Features:

  • Sorting
  • Exporting
  • Filtering
  • Column Pinning
  • Column Hiding

Sales Dashboard

Angular Sales Dashboard Example App

Description:
Angular sales app example for summaries by region, product, and time periods, with options for detailed trend analysis and KPIs.

Components Used:

  • Pivot Grid
  • Pivot Data Selector
  • Button
  • Icon
  • Toggle
  • Tooltip
  • Dropdown
  • Excel Exporter Service
  • CSV Exporter Service

Features:

  • Sorting
  • Exporting
  • Filtering
  • Resizing
  • Super Compact Mode

About

Explore these five Angular examples crafted with Ignite UI for Angular. From data grids to high-performance charts – you can explore them all, see how it’s done, and learn best practices.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Contributors 12