Forum Discussion

NanthanW's avatar
NanthanW
New Member
1 year ago

Error embedding a visual in an Angular app using Power BI Embedded

Hi all,

 

I've built an application that embeds power bi reports in a custom web portal. The application is built on Angular 18, and I'm using the Power BI Angular module. I'm running into a very strange issue when attempting to embed a specific visual using the PowerBIVisualEmbed component. I'm able to embed a visual from the page of the report that I want, but no matter what visualName I provide in the visual config object, it only embeds one specific visual. For reference, here's my visual config object:

visualConfig:IVisualEmbedConfiguration = {
    type: 'visual',
    tokenType: models.TokenType.Aad,
    pageName: 'Embedded',
    accessToken: this.accessToken,
    id: this.reportId,
    visualName: this.visualId,      <----    No matter what I set this value to, it always embeds the same visual.
    embedUrl: this.embedUrl,
  }
 
As I've mentioned, clearly the issue isn't with my access token, report id, or embed url, because I get no errors thrown, and it successfully embeds a visual, it's just always the wrong one. Even if I change the visualName to completely random characters, it doesn't throw an error, and still embeds the same wrong visual.
 
I tried using the powerbi-client js library instead of going through the angular library, and I ran into the same exact issue.
 
Is there something that I'm missing? I've had a very difficult time finding any information online about directly embedding a visual, hence why I'm coming here. Any help would be greatly appreciated!

1 Reply