Angular Report Viewer Report Source Update

[Bob]

I'm using the new Angular Report Viewer. My Component allows the user to change different parameters to generate the report. The first time the report runs, everything is fine. When a new set of parameters are selected, requesting the report still shows the report with the initial parameters.

In the prior version, I was able to get this to work by doing this in my ts file:

const v1 = $('#reportViewer1').data('telerik_ReportViewer');
v1.reportSource(requestedReportSource)
v1.refreshReport();

Where requestedReportSource contained the new report parameters.

In the new TelerikReportViewerComponent, I see there' a setReportSource() method, but I'm unable to get the right JSON parameter format to be passed to the method.

Any examples on how to update the ReportSource for the component would be appreciated.

Bob

 

 

[Katia]

Hi Bob,

You can check the update in the support ticket #1110176 that you opened on the same question. For other members interested in this topic, below is the reply from the ticket:

"setReportSource method of the viewer can be used to update the report source as following:

<button (click)="viewer1.setReportSource({report: 'assembly-qualified name of the report or path to the file',
parameters: { Parameter1: 'value'}})">Refresh Report</button>

This method expects a JSON object with report(string) and parameters(JSON) properties - Angular Report Viewer Methods."


Regards,
Katia
Telerik by Progress

[Bob]

ngOnInit() {
  this.setParameters();
}

setParameters(): void {
  this.reportViewer.setReportSource({
    report: 'Residents.trdp',
    parameters: {}
  });
}

This comes up with the error 

Argument of type '{ report: string; }' is not assignable to parameter of type 'JSON'.
  Type '{ report: string; }' is missing the following properties from type 'JSON': parse, stringify, [Symbol.toStringTag]

[Bob]

I didn't submit this post. It just appeared in email....

 

[Bob]

I'm also called Bob...

[Bob]

For anyone interested The following code was used to cast the reportSource object:

ngAfterViewInit() {
  this.setReportSource();
}

setReportSource(): void {
  let rs = {
    report: 'FoodAndFluid.trdp',
    parameters: {
      NcEntityId: this.id,
      From: this.range.From,
      To: this.range.To
    }
  } as unknown as JSON;
  this.viewer.setReportSource(rs);
}

[Silviya]

Hi Bob,
 
Thank you for bringing this issue to our attention. We consider this as a bug and it is already logged to our Public Feedback and Ideas portal on your behalf (Angular Report Viewer Report Source Update throws an error). 

Thank you also for coming up with a possible workaround.

Best Regards,
Silviya
Progress Telerik