IgxInputGroupComponent

new IgxInputGroupComponent(): IgxInputGroupComponent

Defined in projects/igniteui-angular/input-group/src/input-group/input-group.component.ts:232

Returns IgxInputGroupComponent

Property that enables/disables the auto-generated class of the input group. By default applied the class is applied.

@ViewChild("MyInputGroup")
 public inputGroup: IgxInputGroupComponent;
 ngAfterViewInit(){
 this.inputGroup.defaultClass = false;

}

defaultClass: boolean = true

Defined in projects/igniteui-angular/input-group/src/input-group/input-group.component.ts:77

Prevents automatically focusing the input when clicking on other elements in the input group (e.g. prefix or suffix).

suppressInputAutofocus: boolean = false

Defined in projects/igniteui-angular/input-group/src/input-group/input-group.component.ts:113

Remarks

Automatic focus causes software keyboard to show on mobile devices.

Example

<igx-input-group [suppressInputAutofocus]="true"></igx-input-group>

Returns whether the input group has border.

@ViewChild("MyInputGroup")
public inputGroup: IgxInputGroupComponent;
ngAfterViewInit(){
   let inputBorder = this.inputGroup.hasBorder;
}
get hasBorder(): boolean

Defined in projects/igniteui-angular/input-group/src/input-group/input-group.component.ts:317

Returns boolean

Returns whether the input group has hints.

@ViewChild("MyInputGroup")
public inputGroup: IgxInputGroupComponent;
ngAfterViewInit(){
   let inputHints = this.inputGroup.hasHints;
}
get hasHints(): boolean

Defined in projects/igniteui-angular/input-group/src/input-group/input-group.component.ts:281

Returns boolean

Returns true if the input group theme is Bootstrap.

@ViewChild("MyInputGroup1")
public inputGroup: IgxInputGroupComponent;
ngAfterViewInit(){
   let isTypeBootstrap = this.inputGroup.isTypeBootstrap;
}
get isTypeBootstrap(): boolean

Defined in projects/igniteui-angular/input-group/src/input-group/input-group.component.ts:434

Returns boolean

Returns whether the input group type is border.

@ViewChild("MyInputGroup1")
public inputGroup: IgxInputGroupComponent;
ngAfterViewInit(){
   let isTypeBorder = this.inputGroup.isTypeBorder;
}
get isTypeBorder(): boolean

Defined in projects/igniteui-angular/input-group/src/input-group/input-group.component.ts:404

Returns boolean

Returns whether the input group type is box.

@ViewChild("MyInputGroup1")
public inputGroup: IgxInputGroupComponent;
ngAfterViewInit(){
   let isTypeBox = this.inputGroup.isTypeBox;
}
get isTypeBox(): boolean

Defined in projects/igniteui-angular/input-group/src/input-group/input-group.component.ts:349

Returns boolean

Returns true if the input group theme is Fluent.

@ViewChild("MyInputGroup1")
public inputGroup: IgxInputGroupComponent;
ngAfterViewInit(){
   let isTypeFluent = this.inputGroup.isTypeFluent;
}
get isTypeFluent(): boolean

Defined in projects/igniteui-angular/input-group/src/input-group/input-group.component.ts:419

Returns boolean

Returns true if the input group theme is Indigo.

@ViewChild("MyInputGroup1")
public inputGroup: IgxInputGroupComponent;
ngAfterViewInit(){
   let isTypeIndigo = this.inputGroup.isTypeIndigo;
}
get isTypeIndigo(): boolean

Defined in projects/igniteui-angular/input-group/src/input-group/input-group.component.ts:449

Returns boolean

Returns whether the input group type is line.

@ViewChild("MyInputGroup1")
public inputGroup: IgxInputGroupComponent;
ngAfterViewInit(){
   let isTypeLine = this.inputGroup.isTypeLine;
}
get isTypeLine(): boolean

Defined in projects/igniteui-angular/input-group/src/input-group/input-group.component.ts:334

Returns boolean

Returns whether the input group type is search.

@ViewChild("MyInputGroup1")
public inputGroup: IgxInputGroupComponent;
ngAfterViewInit(){
   let isTypeSearch = this.inputGroup.isTypeSearch;
}
get isTypeSearch(): boolean

Defined in projects/igniteui-angular/input-group/src/input-group/input-group.component.ts:464

Returns boolean

Sets the resource strings. By default it uses EN resources.

set resourceStrings(value: IInputResourceStrings): void

Defined in projects/igniteui-angular/input-group/src/input-group/input-group.component.ts:54

Parameters

Returns void

Returns the theme of the input. The returned value is of type input group type.

@ViewChild("MyInputGroup")
public inputGroup: IgxInputGroupComponent;
ngAfterViewInit() {
 let inputTheme = this.inputGroup.theme;
}
get theme(): IgxTheme

Defined in projects/igniteui-angular/input-group/src/input-group/input-group.component.ts:228

Returns IgxTheme

Sets the theme of the input. Allowed values of type input group theme.

@ViewChild("MyInputGroup")
public inputGroup: IgxInputGroupComponent;
ngAfterViewInit() {
 let inputTheme = 'fluent';
}
set theme(value: IgxTheme): void

Defined in projects/igniteui-angular/input-group/src/input-group/input-group.component.ts:214

Parameters

Returns void

Returns the type of the input group. How the input is styled. The default is box.

@ViewChild("MyInputGroup")
public inputGroup: IgxInputGroupComponent;
ngAfterViewInit(){
   let inputType = this.inputGroup.type;
}
get type(): IgxInputGroupType

Defined in projects/igniteui-angular/input-group/src/input-group/input-group.component.ts:199

Returns IgxInputGroupType

Sets how the input will be styled. Allowed values of type input group type.

<igx-input-group [type]="'search'">
set type(value: IgxInputGroupType): void

Defined in projects/igniteui-angular/input-group/src/input-group/input-group.component.ts:184

Parameters

Returns void