Constructors

Section titled "Constructors"

IgxFlexDirective

new IgxFlexDirective(): IgxFlexDirective

Returns IgxFlexDirective

Properties

Section titled "Properties"

basis

Section titled "basis"

Applies the flex-basis attribute to an element that uses the directive.

Default value is auto.

Other possible values include content, max-content, min-content, fit-content.

<div igxFlex igxFlexBasis="fit-content">Content</div>
basis: string = 'auto'

Defined in projects/igniteui-angular/directives/src/directives/layout/layout.directive.ts:216

flex

Section titled "flex"

Applies the directive to an element.

Possible values include igxFlexGrow, igxFlexShrink, igxFlexOrder, igxFlexBasis.

<div igxFlex>Content</div>
flex: string = ''

Defined in projects/igniteui-angular/directives/src/directives/layout/layout.directive.ts:188

grow

Section titled "grow"

Applies the grow attribute to an element that uses the directive.

Default value is 1.

<div>
   <div igxFlex igxFlexGrow="0">Content1</div>
   <div igxFlex igxFlexGrow="1">Content2</div>
   <div igxFlex igxFlexGrow="0">Content3</div>
</div>
grow: number = 1

Defined in projects/igniteui-angular/directives/src/directives/layout/layout.directive.ts:162

order

Section titled "order"

Applies the order attribute to an element that uses the directive.

Default value is 0.

<div>
   <div igxFlex igxFlexOrder="1">Content1</div>
   <div igxFlex igxFlexOrder="0">Content2</div>
   <div igxFlex igxFlexOrder="2">Content3</div>
</div>
order: number = 0

Defined in projects/igniteui-angular/directives/src/directives/layout/layout.directive.ts:203

shrink

Section titled "shrink"

Applies the shrink attribute to an element that uses the directive.

Default value is 1.

<div>
   <div igxFlex igxFlexShrink="1">Content1</div>
   <div igxFlex igxFlexShrink="0">Content2</div>
   <div igxFlex igxFlexShrink="1">Content3</div>
</div>
shrink: number = 1

Defined in projects/igniteui-angular/directives/src/directives/layout/layout.directive.ts:177