Complete Angular UI library |Primeng Components

In this post, We will go through the what is Primeng Framework, explains about different UI components .

#What is Primeng?

Primeng is a popular Opensource UI library for developing Rich UI apps & components in Angular Framework UI. This was created by the Primefaces team at Primetek company.

Primetek provides rich UI libraries for different languages.

• Primefaces is a java library for JSF UI reusable components.
• PrimeUI HTML5 JQuery UI framework
• Primeng UI library is based on typescript language for the Angular framework.
• PrimeReact is a Complete UI component library for ReactJs.
• PrimeVue is a UI component toolkit for Vuejs.

It is open source under the Apache license.

It has support for Angular latest versions. It provides an npm library to integrate into your project.

Angular is a popular MVC framework from Google for Developing software applications.

Primeng provides Pre built, tested rich UI components, easy integrate into angular apps. It provides UI components, input controls like Button, label, and data tables, trees, and UI themes.

It helps to build wide range of solutions to build common UI designs, helps developers to build faster.

#Primeng features lists

• Provides Rich Inbuilt controls
• Rich Data table with sorting, filtering, and pagination
• Theme Designer
• Support All browsers
• Native mobile
• Opensource and free to use
• Responsive same code base works in all devices from desktop to mobile devices.
• Inbuilt Theme supports. And also provides tools to create/customize own themes.
• Integration with REST API to consume JSON format data.

#Primeng Form Input UI Controls

Input UI controls are used to design UI forms to take input from the user. Primeng provides complete Form input control set and widgets like Textbox, Textarea, Dropdown, Radio buttons, Multi Selects, Calendars and Spinners

Normal Buttons and SplitButton are also available.

#Primeng Data Controls

There are several data controls to display data in table format as well as tree format ie TurboTable, DataView, and Tree and Tree table.

And also Scheduler widget is to displays the events in full calendar mode. and also several available components, Datascroller, order list, and Carousel components in the slider.

#Primeng Charts components

Charts are used to display the data in the form of charts. Priming charts based on the ChartJS library. You need to install this library first to use charts.

Bar, Line, Pie, PolarArea, and Doughnut charts are available.

PrimeDesigner API:

This is a powerful Designer tool to design your themes based on primeng styles. It has support for Sass Styling and this is not free but licensed

#Primeng Icons

All the components used in this library internally use a custom icons library called primeicons.

These icons are used by Primefaces and PrimeUI library. This library also uses the font awesome icon library.

This library can be used in your project in many ways.

• Using Primeng with the Angular CLI tool
• Using the SystemJS library
• Using Primeng with web pack bundler

This is a list of primeng components and their modules