Hi Toan,
Greetings from syncfusion support
From your update, we could see that you like to use the Custom toolbar items and also like to display the Toolbar icon. Actions for this customized toolbar items are defined in the toolbarClick event, and you can display the icon by defining the respective CSS content. Please refer the below code example, sample and documentation for more information.
|
App.component.ts
toolbarClick(args) {
if (args.item.id === 'excelexport') {
this.normalgrid.excelExport();
}
}
public ngOnInit(): void {
this.data = orderDataSource;
this.toolbar = [{ text: 'Export the Excel File', tooltipText: 'Export Excel', prefixIcon: 'e-Excel_Export', id: 'excelexport' }];
}
|
|
Index.html
<Style>
.e-Excel_Export:before {
content: "\e242";
}
</style>
|
You can use custom icons as you want by defining the respective CSS content. Please refer the below documentation for more information.
Regards,
Rajapandi R
