Forum Discussion
Syncing Angular Report Center with Paginated Reports
- 9 months ago
Hi Devaprasad_3 , Thank you for reaching out to the Microsoft Community Forum.
When embedding Power BI Paginated Reports in a custom Angular web app, the key is aligning your app’s user context (UserID, RoleID, etc.) with the report’s parameters so each user only sees their own data. You already have a UserID parameter driving a cascading Enterprise parameter, which is the correct report-side approach.
In Power BI Report Builder, make sure the @UserID parameter is set to Hidden (so users can’t alter it) and has no default value. The @Enterprise parameter should reference it in its dataset query (for example, filtering WHERE UserID = @UserID). Test cascading locally in Report Builder and again after publishing to Power BI Service by manually setting parameter values to confirm it works end to end.
For embedding, never pass sensitive parameters like UserID through the report’s URL, it’s insecure and visible to the client. Instead, use the JavaScript API’s parameterValues property inside your embedConfig object. This keeps everything secure and dynamic. In Angular, your embedding code should look like this:
const embedConfig = {
type: 'report',
id: '<REPORT_ID>',
embedUrl: '<EMBED_URL>',
accessToken: '<EMBED_TOKEN>',
tokenType: models.TokenType.Embed,
settings: {
filterPaneEnabled: false,
navContentPaneEnabled: false
},
parameterValues: [
{ name: 'UserID', value: currentUser.id }
]
};
const report = powerbi.embed(reportContainer, embedConfig);
Behind the scenes, your backend (often Node.js or .NET) should generate an embed token using a Service Principal with the correct Power BI API permissions. The report must live in a Premium (or Premium per User) workspace for paginated embedding to work. Always ensure the parameter names in your report exactly match what you pass in your embedConfig.
Once configured, the user logs into your Angular app, your API generates an embed token for that user context and the frontend securely injects the UserID as a hidden parameter. Power BI automatically filters the report’s datasets via the cascading Enterprise parameter, no manual user filtering or URL tampering possible.
Embed paginated reports in your embedded analytics app - Power BI | Microsoft Learn
Create parameters for paginated reports in Power BI Report Builder - Power BI | Microsoft Learn
Report parameters in Power BI Report Builder - Power BI | Microsoft Learn
Embed a paginated report in Power BI embedded analytics | Microsoft Learn
Hi Devaprasad_3 , Thank you for reaching out to the Microsoft Community Forum.
When embedding Power BI Paginated Reports in a custom Angular web app, the key is aligning your app’s user context (UserID, RoleID, etc.) with the report’s parameters so each user only sees their own data. You already have a UserID parameter driving a cascading Enterprise parameter, which is the correct report-side approach.
In Power BI Report Builder, make sure the @UserID parameter is set to Hidden (so users can’t alter it) and has no default value. The @Enterprise parameter should reference it in its dataset query (for example, filtering WHERE UserID = @UserID). Test cascading locally in Report Builder and again after publishing to Power BI Service by manually setting parameter values to confirm it works end to end.
For embedding, never pass sensitive parameters like UserID through the report’s URL, it’s insecure and visible to the client. Instead, use the JavaScript API’s parameterValues property inside your embedConfig object. This keeps everything secure and dynamic. In Angular, your embedding code should look like this:
const embedConfig = {
type: 'report',
id: '<REPORT_ID>',
embedUrl: '<EMBED_URL>',
accessToken: '<EMBED_TOKEN>',
tokenType: models.TokenType.Embed,
settings: {
filterPaneEnabled: false,
navContentPaneEnabled: false
},
parameterValues: [
{ name: 'UserID', value: currentUser.id }
]
};
const report = powerbi.embed(reportContainer, embedConfig);
Behind the scenes, your backend (often Node.js or .NET) should generate an embed token using a Service Principal with the correct Power BI API permissions. The report must live in a Premium (or Premium per User) workspace for paginated embedding to work. Always ensure the parameter names in your report exactly match what you pass in your embedConfig.
Once configured, the user logs into your Angular app, your API generates an embed token for that user context and the frontend securely injects the UserID as a hidden parameter. Power BI automatically filters the report’s datasets via the cascading Enterprise parameter, no manual user filtering or URL tampering possible.
Embed paginated reports in your embedded analytics app - Power BI | Microsoft Learn
Create parameters for paginated reports in Power BI Report Builder - Power BI | Microsoft Learn
Report parameters in Power BI Report Builder - Power BI | Microsoft Learn
Embed a paginated report in Power BI embedded analytics | Microsoft Learn