Class GridstackItemComponent

Angular component wrapper for individual GridStack items.

This component represents a single grid item and handles:

Dynamic content creation and management
Integration with parent GridStack component
Component lifecycle and cleanup
Widget options and configuration

Use in combination with GridstackComponent for the parent grid.

Example

<gridstack>
  <gridstack-item [options]="{x: 0, y: 0, w: 2, h: 1}">
    <my-widget-component></my-widget-component>
  </gridstack-item>
</gridstack>

Implements

OnDestroy

Index

Accessors

options

get options(): GridStackNode
return the latest grid options (from GS once built, otherwise initial values)

Returns GridStackNode
- Defined in angular/projects/lib/src/lib/gridstack-item.component.ts:100
set options(val: GridStackNode): void
Grid item configuration options. Defines position, size, and behavior of this grid item.
Parameters
- val: GridStackNode
Returns void
Example
```
itemOptions: GridStackNode = {
  x: 0, y: 0, w: 2, h: 1,
  noResize: true,
  content: 'Item content'
};
```
- Defined in angular/projects/lib/src/lib/gridstack-item.component.ts:89

el

get el(): GridItemCompHTMLElement
return the native element that contains grid specific fields as well

Returns GridItemCompHTMLElement
- Defined in angular/projects/lib/src/lib/gridstack-item.component.ts:107

Constructors

constructor

new GridstackItemComponent(
elementRef: ElementRef<GridItemCompHTMLElement>,
): GridstackItemComponent
Parameters
- elementRef: ElementRef<GridItemCompHTMLElement>
Returns GridstackItemComponent
- Defined in angular/projects/lib/src/lib/gridstack-item.component.ts:114

Methods

clearOptions

clearOptions(): void
clears the initial options now that we've built

Returns void
- Defined in angular/projects/lib/src/lib/gridstack-item.component.ts:110

ngOnDestroy

ngOnDestroy(): void
A callback method that performs custom clean-up, invoked immediately before a directive, pipe, or service instance is destroyed.

Returns void
Implementation of OnDestroy.ngOnDestroy
- Defined in angular/projects/lib/src/lib/gridstack-item.component.ts:118

Properties

`Optional`container

container?: ViewContainerRef

Container for dynamic component creation within this grid item. Used to append child components programmatically.

ref

ref: undefined | ComponentRef<GridstackItemComponent>

Component reference for dynamic component removal. Used internally when this component is created dynamically.

childWidget

childWidget: undefined | BaseWidget

Reference to child widget component for serialization. Used to save/restore additional data along with grid position.

`Protected` `Optional`_options

_options?: GridStackNode

`Protected` `Readonly`elementRef

elementRef: ElementRef<GridItemCompHTMLElement>

Class GridstackItemComponent

Example

Implements

Index

Accessors

Constructors

Methods

Properties

Accessors

options

Returns GridStackNode

Parameters

Returns void

Example

el

Returns GridItemCompHTMLElement

Constructors

constructor

Parameters

Returns GridstackItemComponent

Methods

clearOptions

Returns void

ngOnDestroy

Returns void

Properties

`Optional`container

ref

childWidget

`Protected` `Optional`_options

`Protected` `Readonly`elementRef

Settings

On This Page

Class GridstackItemComponent

Example

Implements

Index

Accessors

Constructors

Methods

Properties

Accessors

options

Returns GridStackNode

Parameters

Returns void

Example

el

Returns GridItemCompHTMLElement

Constructors

constructor

Parameters

Returns GridstackItemComponent

Methods

clearOptions

Returns void

ngOnDestroy

Returns void

Properties

Optionalcontainer

ref

childWidget

Protected Optional_options

Protected ReadonlyelementRef

Settings

On This Page

`Optional`container

`Protected` `Optional`_options

`Protected` `Readonly`elementRef