An
property that allows you to disable the active property. By default it's applied.
<igx-icon [active]="false">settings</igx-icon>
This allows you to disable the aria-hidden attribute. By default it's applied.
@ViewChild("MyIcon") public icon: IgxIconComponent;
constructor(private cdRef:ChangeDetectorRef) {}
ngAfterViewInit() {
this.icon.ariaHidden = false;
this.cdRef.detectChanges();
}
An
property that sets the value of the family. By default it's "material".
<igx-icon family="material">settings</igx-icon>
An
property that allows you to set the name of the icon.
<igx-icon name="contains" family="filter-icons"></igx-icon>
An accessor that returns the value of the active property.
@ViewChild("MyIcon")
public icon: IgxIconComponent;
ngAfterViewInit() {
let iconActive = this.icon.getActive;
}
An accessor that returns the value of the family property.
@ViewChild("MyIcon")
public icon: IgxIconComponent;
ngAfterViewInit() {
let iconFamily = this.icon.getFamily;
}
An accessor that returns inactive property.
@ViewChild("MyIcon")
public icon: IgxIconComponent;
ngAfterViewInit() {
let iconActive = this.icon.getInactive;
}
An accessor that returns the value of the iconName property.
@ViewChild("MyIcon")
public icon: IgxIconComponent;
ngAfterViewInit() {
let name = this.icon.getName;
}
An accessor that returns the underlying SVG image as SafeHtml.
@ViewChild("MyIcon")
public icon: IgxIconComponent;
ngAfterViewInit() {
let svg: SafeHtml = this.icon.getSvg;
}
An accessor that returns a TemplateRef to explicit, svg or no ligature.
@ViewChild("MyIcon")
public icon: IgxIconComponent;
ngAfterViewInit() {
let iconTemplate = this.icon.template;
}
Icon provides a way to include material icons to markup
Igx Module
IgxIconModule
Igx Theme
igx-icon-theme
Igx Keywords
icon, picture
Igx Group
Display
Remarks
The Ignite UI Icon makes it easy for developers to include material design icons directly in their markup. The icons support different icon families and can be marked as active or disabled using the
activeproperty. This will change the appearance of the icon.Example