Load new powerbi Report in powerbi-report using Angular

Me using powerbi-client-angular for displaying the powerbi reports to my application. Here we have a situation based on the report selection dropdown need to load corresponding powerbi report .

my html code is

<powerbi-report id="reportContainer" [embedConfig]="reportConfig" [phaseEmbedding]="true" [cssClassName]="'report-container'" [eventHandlers]="eventHandlersMap"></powerbi-report>


When select dropdown chagnes get the new report configuration and load in the container. The report is loading successfully but trying to apply the filters when its being loaded.

this.reportConfig = {
id: data?.id,
embedUrl: data?.embedUrl,
accessToken: localStorage.getItem('AzureAcessToken')!,
tokenType: models.TokenType.Aad,
filters:[this.powerbiFilters[0]],
eventHooks: {
accessTokenProvider: getNewAccessToken
},
settings: {
layoutType: newSettings,
filterPaneEnabled: true,
navContentPaneEnabled: true,
panes: {
filters: {
expanded: false,
visible: true
},
}
},
};


The filters is not being applied to the current report. When consoled the reportObj its showing previously loaded powerbi report. SO Problem here is my current report should replace the existing report and should load with filters.

Is there anyway to reset the report loaded using powerbi-client-angular library

Continue reading...