How do I remove the toolbar from report viewer in angular I just need the report because I'm planning to make a pie chart.
1 Answer, 1 is accepted
answered on 19 Feb 2021, 10:16 AM
Hello Von Christian,
Removing the toolbar is done through the setup of the Angular Report-Viewer, and can not be set in the report itself. The Angular viewer is based on the HTML5 viewer, and by default retrieves an HTML file from the Report REST API that the viewer is based on. This can be overwritten with a different file where adjustments can be made.
When setting up the AppComponent template, as explained in step 7 from 'Using Angular Report Viewer in Angular application', you can add a '[templateUrl]' tag. Inside the tr-viewer package, there is a HTML-template that can be adjusted to not show the toolbar. This HTML-template will typically be located in '.\node_modules\@progress\telerik-angular-report-viewer\dist\dependencies\telerikReportViewerTemplate-sass.html' of the Angular application. You can copy this file into your application and reference it with the '[templateUrl]' tag.
Apply modifications to the copied HTML-template as you want, and if it's resolved correctly, it should use that instead of retrieving an HTML-template from the REST API. In our documentation, we have an article elaborating on the structure of the HTML template, called 'Templates Overview'. Though this is specifically for the HTML5 Viewer, it is very similar to the Angular viewer.
I hope you find this information useful. Let me know if it works out, if you have any challenges, or any other questions.
Virtual Classroom, the free self-paced technical training that gets you up to speed with Telerik and Kendo UI products quickly just got a fresh new look + new and improved content including a brand new Blazor course! Check it out at https://learn.telerik.com/.