Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
16 commits
Select commit Hold shift + click to select a range
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Original file line number Diff line number Diff line change
Expand Up @@ -480,6 +480,10 @@ const restoreGridState = () => {

1 - Define a template reference variable (in the example below it is `#activeTemplate`) and assign an event handler for the `ColumnInit` event:

</ComponentBlock>

<ComponentBlock for="Grid">

<PlatformBlock for="Angular">
```html
<igx-grid id="grid" #grid igxGridState (columnInit)="onColumnInit($event)">
Expand Down Expand Up @@ -561,6 +565,9 @@ function activeTemplate(ctx: { dataContext: IgrCellTemplateContext }) {
```
</PlatformBlock>

</ComponentBlock>

<ComponentBlock for="TreeGrid">

<PlatformBlock for="Angular">
```html
Expand Down Expand Up @@ -626,6 +633,10 @@ public activeTemplate = (ctx: IgcCellTemplateContext) => {

</PlatformBlock>

</ComponentBlock>

<ComponentBlock for="HierarchicalGrid">

<PlatformBlock for="Angular">
```html
<igx-hierarchical-grid id="grid" #grid igxGridState (columnInit)="onColumnInit($event)">
Expand Down Expand Up @@ -669,6 +680,10 @@ public activeTemplate = (ctx: IgcCellTemplateContext) => {

</PlatformBlock>

</ComponentBlock>

<ComponentBlock for="Grid, HierarchicalGrid, TreeGrid">

<PlatformBlock for="Angular">
2 - Query the template view in the component using @ViewChild or @ViewChildren decorator. In the `ColumnInit` event handler, assign the template to the column <ApiLink type="Column" member="bodyTemplate" label="BodyTemplate" /> property:

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -358,13 +358,13 @@ A good thing to note is that the Date Picker Component will always add a leading

<ApiLink pkg="core" type="DatePicker" member="displayFormat" /> is used to format the picker's input when it is not focused. If no <ApiLink pkg="core" type="DatePicker" member="displayFormat" /> is provided, the picker will use the <ApiLink pkg="core" type="DatePicker" member="inputFormat" /> as its <ApiLink pkg="core" type="DatePicker" member="displayFormat" />.

More information about these can be found in the <ApiLink type="IgcDateTimeInput" /> format section.
More information about these can be found in the <ApiLink pkg="core" type="DateTimeInput" /> format section.

<Sample src="/scheduling/date-picker/format" height={500} alt="{Platform} Date Picker Input Format Example" />

### Increment and decrement

The <ApiLink pkg="core" type="DatePicker" /> exposes <ApiLink pkg="core" type="DatePicker" member="stepUp" /> and <ApiLink pkg="core" type="DatePicker" member="stepDown" /> methods. Both of which come from the <ApiLink type="IgcDateTimeInput" /> and can be used for incrementing and decrementing a specific <ApiLink pkg="core" type="DatePart" /> of the currently set date.
The <ApiLink pkg="core" type="DatePicker" /> exposes <ApiLink pkg="core" type="DatePicker" member="stepUp" /> and <ApiLink pkg="core" type="DatePicker" member="stepDown" /> methods. Both of which come from the <ApiLink pkg="core" type="DateTimeInput" /> and can be used for incrementing and decrementing a specific <ApiLink pkg="core" type="DatePart" /> of the currently set date.

<PlatformBlock for="WebComponents">

Expand Down
Loading
Loading