Called when the button is clicked.
Called when the button is selected.
Sets/gets the role
attribute.
this.button.role = 'navbutton';
let buttonRole = this.button.role;
Sets the background color of the button.
<button igxButton igxButtonBackground="red"></button>
Sets the button text color.
<button igxButton igxButtonColor="orange"></button>
Get the disabled state of the button;
const disabled = this.button.disabled;
Enables/disables the button.
<button igxButton= "fab" [disabled]="true"></button>
Returns the theme of the component.
The default theme is comfortable
.
Available options are comfortable
, cosy
, compact
.
let componentTheme = this.component.displayDensity;
Sets the theme of the component.
Sets the aria-label
attribute.
<button igxButton="flat" igxLabel="Label"></button>
Returns the underlying DOM element.
Gets or sets whether the button is selected. Mainly used in the IgxButtonGroup component and it will have no effect if set separately.
<button igxButton="flat" [selected]="button.selected"></button>
Sets the type of the button.
<button igxButton="icon"></button>
The Button directive provides the Ignite UI Button functionality to every component that's intended to be used as a button.
Igx Module
IgxButtonModule
Igx Parent
Data Entry & Display
Igx Theme
igx-button-theme
Igx Keywords
button, span, div, click
Remarks
The Ignite UI Button directive is intended to be used by any button, span or div and turn it into a fully functional button.
Example