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 Theme
igx-button-theme
Igx Keywords
button, span, div, click

Remarks

[object Object]

Example

<button type="button" igxButton="outlined">A Button</button>

Constructors

Section titled "Constructors"

IgxButtonDirective 

new IgxButtonDirective(): IgxButtonDirective

Defined in projects/igniteui-angular/directives/src/directives/button/button-base.ts:60

Returns IgxButtonDirective

Properties

Section titled "Properties"

buttonClick

Section titled "buttonClick"

Inherited from: IgxButtonBaseDirective

Emitted when the button is clicked.

 
buttonClick: EventEmitter<MouseEvent>

Defined in projects/igniteui-angular/directives/src/directives/button/button-base.ts:53

buttonSelected

Section titled "buttonSelected"

Emitted when the button is selected.

 
buttonSelected: EventEmitter<IButtonEventArgs>

Defined in projects/igniteui-angular/directives/src/directives/button/button.directive.ts:51

Accessors

Section titled "Accessors"

disabled

Section titled "disabled"

Inherited from: IgxButtonBaseDirective 

get disabled(): boolean

Defined in projects/igniteui-angular/directives/src/directives/button/button-base.ts:47

Returns boolean

Gets or sets whether the button is disabled.

 
set disabled(value: boolean): void

Defined in projects/igniteui-angular/directives/src/directives/button/button-base.ts:43

Example

<button type="button" igxButton="flat" [disabled]="isDisabled"></button>

Parameters

  • value: boolean

Returns void

label

Section titled "label"

Sets the aria-label attribute.

 
set label(value: string): void

Defined in projects/igniteui-angular/directives/src/directives/button/button.directive.ts:93

Example

<button type="button" igxButton="flat" igxLabel="Label"></button>

Parameters

  • value: string

Returns void

nativeElement

Section titled "nativeElement"

Inherited from: IgxButtonBaseDirective

Returns the underlying DOM element.

 
get nativeElement(): HTMLElement

Defined in projects/igniteui-angular/directives/src/directives/button/button-base.ts:56

Returns HTMLElement

selected

Section titled "selected"

Gets or sets whether the button is selected. Mainly used in the button group component and it will have no effect if set separately.

 
set selected(value: boolean): void

Defined in projects/igniteui-angular/directives/src/directives/button/button.directive.ts:63

Example

<button type="button" igxButton="flat" [selected]="button.selected"></button>

Parameters

  • value: boolean

Returns void

type

Section titled "type"

Sets the type of the button.

 
set type(type: IgxButtonType): void

Defined in projects/igniteui-angular/directives/src/directives/button/button.directive.ts:80

Example

<button type="button" igxButton="outlined"></button>

Parameters

Returns void