I'm setting up a page with kendo grid, which contains kendotoolbar and kendo toolbar button, all I need to generate custom buttons which helps to generate excel report, mailing, etc. The problem is kendo grid and kendo toolbars are working separately , but not together in below code(only kendo grid is visible). Used ng add @progress/kendo-angular-toolbar for the addition of the toolbar
<kendo-grid [data]="records"
[pageSize]="state.take"
[skip]="state.skip"
[sort]="state.sort"
[sortable]="true"
[pageable]="true"
[scrollable]="'scrollable'"
[groupable]="false"
[group]="state.group"
[filterable]="true"
[filter]="state.filter"
(dataStateChange)="dataStateChange($event)"
[selectable]="true"
(selectionChange)="gridUserSelectionChange(gridUser, $event)"
(dblclick)='onDblClick()'
[height]="500"
(edit)="editHandler($event)"
(remove)="removeHandler($event)">
<kendo-grid-command-column title="command" width="200">
<ng-template kendoGridCellTemplate>
<button mat-button kendoGridEditCommand><mat-icon >edit</mat-icon></button>
<button mat-button kendoGridRemoveCommand><mat-icon >delete</mat-icon></button>
</ng-template>
</kendo-grid-command-column>
<kendo-grid-column
*ngFor="let column of columns"
field={{column}} title="{{column}}" ></kendo-grid-column>
<kendo-toolbar>
<kendo-toolbar-button [text]="'Edit'"
[showText]="'both'"
[icon]="'edit'"
[showIcon]="'both'"
[primary]="true"
[look]="look"
[disabled]="false"
[tabIndex]="tabIndex"
></kendo-toolbar-button>
</kendo-toolbar>
</kendo-grid>
The Above Code is working , after i added the command of the installation of toolbar ng add @progress/kendo-angular-toolbar; Please Refer the link: enter link description here for more info. Thanks