Angular PrimeNG Button Complete Reference

Angular PrimeNG Button facilitates different standards of Buttons that define the various functionalities & denote the status and severities of the Button. It also provides different styling, such as a Split button, and Speed Dial button for the button component, which enhances the overall user experience of the Site.

The complete list of Button Component is listed below with their brief description:

Button Component

A Button Component is generally used for carrying out some action when clicked. Buttons in the PrimeNG library come in different shapes, sizes, and many other properties.

Components	Descriptions
Basic Component	These basic buttons are a simple button, a disabled button, and a link button.
Icons Component	The icon for a button can be specified using the icon property and its position can be altered using the iconPos property of the button.
Severities Component	A Button is generally used for carrying out some action when clicked.
Raised Buttons Component	The raised button gives the user a feeling of click as it goes down when we click on it
Rounded Buttons Component	A rounded button has its corners rounded.
Text Buttons Component	Text buttons are buttons that have a transparent background and show borders when clicked.
Button Label	The label property of the button component is used to set the text of the button.
Button Events	There are other events such as buttons being focused or losses focusing when the actions can be performed.
Severity Component	There are a total of 6 severity levels: Primary (default), Secondary, Success, Info, Warning, Help, and Danger.
Text Buttons Component	Text buttons are buttons that have a transparent background and show borders when clicked.
Outlined Buttons Component	Outlined buttons are used for more emphasis than a text or link button and less emphasis than a filled button.
Link Buttons Component	The Link button has a transparent background and is styled as a link (<a> tag).
Badges Component	A badge can be used to show some extra information to the user
ButtonSet Component	We can create a button set by wrapping the buttons in a container having the class p-buttonset.
Button Sizes	In addition to the default size, two more sizes are available: small and large.
Loading State Component	A loading button is used to give the user a signal that something is loading in the background
Properties of pButton	Buttons in the PrimeNG library come in different shapes, sizes, and many other properties.
Properties of p-button	Buttons in the PrimeNG library come in different shapes, sizes, and many other properties.
Button Templates	Buttons in the PrimeNG library come in different shapes, and sizes, and many other properties
Styling	There are 3 structural style classes for the button component: p-button, p-button-icon, and p-button-label.

SplitButton Component

The SplitButton component is used to make a button as a dropdown.

Components	Descriptions
Animation Configuration Component	The SplitButton Component is used to make a button a dropdown.
MenuModel API Component	PrimeNG menus components share a common API to specify the menuitems and submenus.
Properties Component	This component can be used to include the different properties to the SplitButton Component.
Events	It is used to execute a callback function when the main button is clicked.
Severity	There are 7 severity levels: Primary (default), Secondary, Success, Info, Warning, Help, and Danger.
Raised and Rounded Buttons Component	It is used to make the button background appear higher than the normal level.
Styling	This component helps to make the interactive SplitButton by implementing the different stylings provided by Angular PrimeNG.

Speed Dial Component

The SpeedDial Component is used to display many primary actions that can be done using the floating button action while pressing the button.

Components	Descriptions
Type	The type of the Speed Dial can be specified using the type property.
Linear	The SpeedDial Component is used to display many primary actions that can be done using the floating button action while pressing the button.
Circle, Semi-Circle and Quarter-Circle	It is the inline style of the element. It is of object data type, the default value is null.
Tooltip	It is the inline style of the element. It is of object data type, the default value is null.
Transition Duration, Icon and No Rotate Animation	It specifies the opening direction of actions. It is of string data type, the default value is up.
Mask	It specifies the opening type of actions. It is of string data type, and the default value is linear.
Direction	The SpeedDial Component is used to display many primary actions that can be done using the floating button action while pressing the button.
Properties	It is the unique identifier of the element. It is of string data type, the default value is null.
Templates	The templates are used to put some content on some pre-structured containers.
Events	There are a total of 4 events for the SpeedDial component.
Styling	The SpeedDial Component is used to display many primary actions that can be done using the floating button action while pressing the button.