Angular components for enumerating, rendering and interacting with reports hosted in an Azure PowerBI Embed workspace. This package will work with both ng2 and ng4.
Install via npm:
npm install --save powerbi-ng2
Import the module into your main module (generally app.module.ts):
import { PowerBIModule, ReportsListServiceConfig } from 'powerbi-ng2';
let _reportsListAPIEndPoint: string = "end point of your reports list Web API enumerating the reports and providing accesss tokens";
const config:ReportsListServiceConfig = {
WebAPIServiceUrl: 'end point of your reports list Web API enumerating the reports and providing accesss tokens'
};
@NgModule({
bootstrap: [ ... ],
declarations: [
...
],
imports: [
PowerBIModule.forRoot(config)
...
]
})
Note: This module depends on the Microsoft PowerBIEmbed Javascript API. Version 2.3.2 and 2.3.3 introduced naming based incompatibilities See Issue #225. Therefore, the module requires 2.3.4 or higher as a dependency.
Note: If you use this module in conjunction with Universal (ng2), make sure to include PowerBIModule before UniversalModule as there is a conflict between the standard ng http module imported by it and the ony used by Universal. See [angular/universal-starter#167] and [angular/universal#536 (comment)] for more information.
Use the various components inside your angular components. Use the ReportsListService to get a list of available reports from your workspace for navigation purposes and to get embed tokens for a particular report (alternatives, you can use the ReportsList component for that purpose).
Note that the components depend on a service endpoint (_reportsListAPIEndPoint above) for enumreation of reports and token generation. See Sample Report Service for a sample implementation of such a service using .NET Web Api 2.0.
Check out the Wiki for detailed documentation on components, models and providers. SDK documentation for this project is availabel at https://infusion-code.github.io/powerbi-ng2/.