Skip to main content
cancel
Showing results for 
Search instead for 
Did you mean: 

Join us for an expert-led overview of the tools and concepts you'll need to become a Certified Power BI Data Analyst and pass exam PL-300. Register now.

Reply
Marco57
Helper III
Helper III

Avoid report re embedding on route change in Angular

Hello,

 

I have an angular component containing my html container on which the embedding is going to happen. Now on route change, this component is getting destroyed and so does its html container containing the report. When user is getting back to the report route, the component is initializing again and re embedding from scratch the report, removing any changes made from the user to the report.

 

I would like to know if there are means to make the report survive it component destruction. I thought about means like making the embedding process happening in a service being called from the component displaying the report. Issue is I do not see how to set that practically and what exactly should the service return : the html container or the result of pbi.embed() method?

 

This is currently the method called from my service onInit of my report viewer component:

 

 

this.powerbiService
      .getReportEmbedInfoById()
      .subscribe(async (data) => {
        if (this.pbiContainerElement) {
          const embedConfig = this.powerbiService.buildEmbedConfig(data);
          powerbi.reset(this.pbiContainerElement);
          this.myReport = powerbi.embed(this.pbiContainerElement, embedConfig);
          // report.off removes all event handlers for a specific event
          this.myReport.off('loaded');
          // report.on will add an event handler
          this.myReport.on('loaded', () => {
            this.powerbiService.handleTokenExpiration(this.myReport);
            loadedResolve();
            // this.myReport.off("loaded");
          });
      });

 

 Thanks for any support.

4 REPLIES 4
sdk1990
Microsoft Employee
Microsoft Employee

Hi @Marco57 

 

We have the same issue. Can you please share how you were able to resolve it and if the recommendation provided by v-shex-msft worked? Thanks!

 

 

Anonymous
Not applicable

HI @Marco57,

According to your description, it sounds like you want to avoid the user changes on your report?
If that is the case, I'd like to suggest you not sharing the 'edit' permission to this report, then changes on this content will be reset when the report reload.

Regards,
Xiaoxin Sheng

Hi @Anonymous,

 

I actually want to keep the changes from user to the report as long as they did not ask explicitlly to refresh the report, thus re embedding it and getting the original version of it. I am currently embedding it as view mode only.

 

Some temporary changes are being made from the user but when he navigates to another root of the web application embedding the report, then the embedded report is destroyed and embedded again from scratch when user gets back to the report root of the web application.

 

What I want is to find a way to not re start the full embedding process when Angular changes its route to a differente one from within the web application. If the user explicitly refreshed the web application, then it is ok that it embeds a report from scratch, but not on route change.

 

Thanks

Rgds

Marc. 

Anonymous
Not applicable

Hi @Marco57,

So you mean to keep current changes avoid refresh when you change data source?
If that is the case, you can enable the persistent filter or try to create a global variable to save current filters and restore them to the new report contents after the report refreshed:

Enable persistent filters in a Power BI embedded analytics application | Microsoft Docs

Create, edit, and save an embedded report | Microsoft Docs

Regards,
Xiaoxin Sheng

Helpful resources

Announcements
Join our Fabric User Panel

Join our Fabric User Panel

This is your chance to engage directly with the engineering team behind Fabric and Power BI. Share your experiences and shape the future.

June 2025 Power BI Update Carousel

Power BI Monthly Update - June 2025

Check out the June 2025 Power BI update to learn about new features.

June 2025 community update carousel

Fabric Community Update - June 2025

Find out what's new and trending in the Fabric community.