Angular ejs-chart: How to check BE reply before rendering series?

1 Reply
2 Participants

Created by
EB Ewa Baumgarten

Platform
Angular - EJ 2

Platform
Angular - EJ 2

Control
Chart

Created On
Aug 14, 2023 08:14 AM UTC

Last Activity On
Aug 15, 2023 09:28 AM UTC

Want to subscribe?
SIGN IN

Hello,

after an update of third-party libraries in the BE my app is connecting to, I've run into an edge case: the BE will return a status code of 200, but the response holds an exception.

Since the request claims to have been a success, this approach doesn't work for me.

Here's the full BE response (yes, it's cut off):


{
    "@odata.context": "https://localhost/api/v1/MyEndpoint/Filter/$metadata#odata",
    "value": [
        {
            "errorType": "INTERNAL_SERVER_ERROR",
            "statusCode": 200,
            "message": null,
            "exception": null
        }

This is how I'm setting the series data:

const series = selection.selectedDataPointRows.map((dataPoint) => {
      const seriesItem: SeriesModel = {
        dataSource: this.reportsDataManager,
        query: this.getDataQuery(
          {
            startDate: selection.startDate,
            endDate: selection.endDate,
          },
        ),
      };
      return seriesItem;
    });
    try {
      this.chart?.clearSeries();
      this.chart?.addSeries(series);
    } catch (err) {
      this.notificationService.notify('GLOBAL.ERROR_LOADING');
      // this.isLoadingData = false;
    }

Needless to say that I don't run into the catch block either.

This is the full stacktrace:

Uncaught SyntaxError SyntaxError: Expected ',' or ']' after array element in JSON at position 171
    at parseJson (C:\Path\to\repositoryode_modules\@syncfusion\ej2-data\dist\es6\ej2-data.es5.js:2835:33)
    at fnSuccess (C:\Path\to\repositoryode_modules\@syncfusion\ej2-data\dist\es6\ej2-data.es5.js:6224:39)
    at Ajax.successHandler (C:\Path\to\repositoryode_modules\@syncfusion\ej2-base\dist\es6\ej2-base.es5.js:4126:18)
    at Ajax.stateChange (C:\Path\to\repositoryode_modules\@syncfusion\ej2-base\dist\es6\ej2-base.es5.js:4154:30)
    at _this.httpRequest.onreadystatechange (C:\Path\to\repositoryode_modules\@syncfusion\ej2-base\dist\es6\ej2-base.es5.js:4088:72)
    at wrapFn (C:\Path\to\repositoryode_modules\zone.js\dist\zone.js:811:43)
    at _ZoneDelegate.invokeTask (C:\Path\to\repositoryode_modules\zone.js\dist\zone.js:446:35)
    at  (C:\Path\to\repositoryode_modules\@angular\core\fesm2022\core.mjs:25960:55)
    at onInvokeTask (C:\Path\to\repositoryode_modules\@angular\core\fesm2022\core.mjs:25960:36)
    at _ZoneDelegate.invokeTask (C:\Path\to\repositoryode_modules\zone.js\dist\zone.js:445:64)
    at onInvokeTask (C:\Path\to\repositoryode_modules\@angular\core\fesm2022\core.mjs:26261:33)
    at _ZoneDelegate.invokeTask (C:\Path\to\repositoryode_modules\zone.js\dist\zone.js:445:64)
    at Zone.runTask (C:\Path\to\repositoryode_modules\zone.js\dist\zone.js:211:51)
    at ZoneTask.invokeTask (C:\Path\to\repositoryode_modules\zone.js\dist\zone.js:528:38)
    at invokeTask (C:\Path\to\repositoryode_modules\zone.js\dist\zone.js:1706:22)
    at globalCallback (C:\Path\to\repositoryode_modules\zone.js\dist\zone.js:1737:31)
    at globalZoneAwareCallback (C:\Path\to\repositoryode_modules\zone.js\dist\zone.js:1773:20)
    --- setTimeout ---
    at scheduleTask (C:\Path\to\repositoryode_modules\zone.js\dist\zone.js:2424:39)
    at _ZoneDelegate.scheduleTask (C:\Path\to\repositoryode_modules\zone.js\dist\zone.js:433:30)
    at Zone.scheduleTask (C:\Path\to\repositoryode_modules\zone.js\dist\zone.js:254:47)
    at Zone.scheduleMacroTask (C:\Path\to\repositoryode_modules\zone.js\dist\zone.js:277:29)
    at scheduleMacroTaskWithCurrentZone (C:\Path\to\repositoryode_modules\zone.js\dist\zone.js:725:29)
    at  (C:\Path\to\repositoryode_modules\zone.js\dist\zone.js:2466:32)
    at proto. (C:\Path\to\repositoryode_modules\zone.js\dist\zone.js:1018:28)
    at setTimeout (C:\Path\to\repositoryode_modules\rxjs\dist\esm\internal\scheduler\timeoutProvider.js:7:16)
    at reportUnhandledError (C:\Path\to\repositoryode_modules\rxjs\dist\esm\internal\util\reportUnhandledError.js:4:21)
    at handleUnhandledError (C:\Path\to\repositoryode_modules\rxjs\dist\esm\internal\Subscriber.js:158:29)
    at next (C:\Path\to\repositoryode_modules\rxjs\dist\esm\internal\Subscriber.js:94:17)
    at _next (C:\Path\to\repositoryode_modules\rxjs\dist\esm\internal\Subscriber.js:60:26)
    at next (C:\Path\to\repositoryode_modules\rxjs\dist\esm\internal\Subscriber.js:31:18)
    at  (C:\Path\to\repositoryode_modules\rxjs\dist\esm\internal\Subject.js:34:30)
    at errorContext (C:\Path\to\repositoryode_modules\rxjs\dist\esm\internal\util\errorContext.js:19:9)
    at next (C:\Path\to\repositoryode_modules\rxjs\dist\esm\internal\Subject.js:27:21)
    at emit (C:\Path\to\repositoryode_modules\@angular\core\fesm2022\core.mjs:22743:15)
    at  (C:\Path\to\repositoryode_modules\@angular\core\fesm2022\core.mjs:26300:55)
    at _ZoneDelegate.invoke (C:\Path\to\repositoryode_modules\zone.js\dist\zone.js:412:30)
    at Zone.run (C:\Path\to\repositoryode_modules\zone.js\dist\zone.js:166:47)
    at runOutsideAngular (C:\Path\to\repositoryode_modules\@angular\core\fesm2022\core.mjs:26173:28)
    at onHandleError (C:\Path\to\repositoryode_modules\@angular\core\fesm2022\core.mjs:26300:18)
    at _ZoneDelegate.handleError (C:\Path\to\repositoryode_modules\zone.js\dist\zone.js:416:41)
    at Zone.runTask (C:\Path\to\repositoryode_modules\zone.js\dist\zone.js:214:48)
    at ZoneTask.invokeTask (C:\Path\to\repositoryode_modules\zone.js\dist\zone.js:528:38)
    at invokeTask (C:\Path\to\repositoryode_modules\zone.js\dist\zone.js:1706:22)
    at globalCallback (C:\Path\to\repositoryode_modules\zone.js\dist\zone.js:1737:31)
    at globalZoneAwareCallback (C:\Path\to\repositoryode_modules\zone.js\dist\zone.js:1773:20)
    --- XMLHttpRequest.send ---
    at scheduleTask (C:\Path\to\repositoryode_modules\zone.js\dist\zone.js:2717:28)
    at _ZoneDelegate.scheduleTask (C:\Path\to\repositoryode_modules\zone.js\dist\zone.js:433:30)
    at onScheduleTask (C:\Path\to\repositoryode_modules\@angular\core\fesm2022\core.mjs:25955:25)
    at _ZoneDelegate.scheduleTask (C:\Path\to\repositoryode_modules\zone.js\dist\zone.js:426:55)
    at onScheduleTask (C:\Path\to\repositoryode_modules\zone.js\dist\zone.js:323:84)
    at _ZoneDelegate.scheduleTask (C:\Path\to\repositoryode_modules\zone.js\dist\zone.js:426:55)
    at Zone.scheduleTask (C:\Path\to\repositoryode_modules\zone.js\dist\zone.js:254:47)
    at Zone.scheduleMacroTask (C:\Path\to\repositoryode_modules\zone.js\dist\zone.js:277:29)
    at scheduleMacroTaskWithCurrentZone (C:\Path\to\repositoryode_modules\zone.js\dist\zone.js:725:29)
    at  (C:\Path\to\repositoryode_modules\zone.js\dist\zone.js:2750:32)
    at proto. (C:\Path\to\repositoryode_modules\zone.js\dist\zone.js:1018:28)
    at  (C:\Path\to\repositoryode_modules\@syncfusion\ej2-base\dist\es6\ej2-base.es5.js:4119:35)
    at ZoneAwarePromise (C:\Path\to\repositoryode_modules\zone.js\dist\zone.js:1340:25)
    at Ajax.send (C:\Path\to\repositoryode_modules\@syncfusion\ej2-base\dist\es6\ej2-base.es5.js:4086:23)
    at DataManager.makeRequest (C:\Path\to\repositoryode_modules\@syncfusion\ej2-data\dist\es6\ej2-data.es5.js:6250:26)
    at DataManager.executeQuery (C:\Path\to\repositoryode_modules\@syncfusion\ej2-data\dist\es6\ej2-data.es5.js:6127:22)
    at  (C:\Path\to\repository\src\app\core\services\local-services\data-managers\multi-backend-data-manager.ts:142:21)
    at  (C:\Path\to\repository\src\app\core\services\local-services\data-managers\multi-backend-data-manager.ts:114:14)
    at doInnerSub (C:\Path\to\repositoryode_modules\rxjs\dist\esm\internal\operators\mergeInternals.js:19:19)
    at outerNext (C:\Path\to\repositoryode_modules\rxjs\dist\esm\internal\operators\mergeInternals.js:14:57)
    at OperatorSubscriber._next (C:\Path\to\repositoryode_modules\rxjs\dist\esm\internal\operators\OperatorSubscriber.js:13:21)
    at next (C:\Path\to\repositoryode_modules\rxjs\dist\esm\internal\Subscriber.js:31:18)
    at  (C:\Path\to\repositoryode_modules\rxjs\dist\esm\internal\observable\innerFrom.js:51:24)
    at _trySubscribe (C:\Path\to\repositoryode_modules\rxjs\dist\esm\internal\Observable.js:37:25)
    at  (C:\Path\to\repositoryode_modules\rxjs\dist\esm\internal\Observable.js:31:30)
    at errorContext (C:\Path\to\repositoryode_modules\rxjs\dist\esm\internal\util\errorContext.js:19:9)
    at subscribe (C:\Path\to\repositoryode_modules\rxjs\dist\esm\internal\Observable.js:22:21)
    at mergeInternals (C:\Path\to\repositoryode_modules\rxjs\dist\esm\internal\operators\mergeInternals.js:50:12)
    at  (C:\Path\to\repositoryode_modules\rxjs\dist\esm\internal\operators\mergeMap.js:13:58)
    at  (C:\Path\to\repositoryode_modules\rxjs\dist\esm\internal\util\lift.js:10:28)
    at  (C:\Path\to\repositoryode_modules\rxjs\dist\esm\internal\Observable.js:26:30)
    at errorContext (C:\Path\to\repositoryode_modules\rxjs\dist\esm\internal\util\errorContext.js:19:9)
    at subscribe (C:\Path\to\repositoryode_modules\rxjs\dist\esm\internal\Observable.js:22:21)
    at  (C:\Path\to\repositoryode_modules\rxjs\dist\esm\internal\operators\defaultIfEmpty.js:6:16)
    at  (C:\Path\to\repositoryode_modules\rxjs\dist\esm\internal\util\lift.js:10:28)
    at  (C:\Path\to\repositoryode_modules\rxjs\dist\esm\internal\Observable.js:26:30)
    at errorContext (C:\Path\to\repositoryode_modules\rxjs\dist\esm\internal\util\errorContext.js:19:9)
    at subscribe (C:\Path\to\repositoryode_modules\rxjs\dist\esm\internal\Observable.js:22:21)
    at mergeInternals (C:\Path\to\repositoryode_modules\rxjs\dist\esm\internal\operators\mergeInternals.js:50:12)
    at  (C:\Path\to\repositoryode_modules\rxjs\dist\esm\internal\operators\mergeMap.js:13:58)
    at  (C:\Path\to\repositoryode_modules\rxjs\dist\esm\internal\util\lift.js:10:28)
    at  (C:\Path\to\repositoryode_modules\rxjs\dist\esm\internal\Observable.js:26:30)
    at errorContext (C:\Path\to\repositoryode_modules\rxjs\dist\esm\internal\util\errorContext.js:19:9)
    at subscribe (C:\Path\to\repositoryode_modules\rxjs\dist\esm\internal\Observable.js:22:21)
    at  (C:\Path\to\repositoryode_modules\rxjs\dist\esm\internal\Observable.js:76:18)
    at ZoneAwarePromise (C:\Path\to\repositoryode_modules\zone.js\dist\zone.js:1340:25)
    at toPromise (C:\Path\to\repositoryode_modules\rxjs\dist\esm\internal\Observable.js:74:16)
    at executeQuery (C:\Path\to\repository\src\app\core\services\local-services\data-managers\multi-backend-data-manager.ts:236:7)
    at reportsDataManager.executeQuery (C:\Path\to\repository\src\app\chart\chart.component.ts:96:8)
    at reportsDataManager.executeQuery (C:\Path\to\repository\src\app\chart\chart.component.ts:96:8)
    at reportsDataManager.executeQuery (C:\Path\to\repository\src\app\chart\chart.component.ts:96:8)
    at Data.getData (C:\Path\to\repositoryode_modules\@syncfusion\ej2-charts\dist\es6\ej2-charts.es5.js:8922:37)
    at SeriesBase.refreshDataManager (C:\Path\to\repositoryode_modules\@syncfusion\ej2-charts\dist\es6\ej2-charts.es5.js:8210:43)
    at Chart.initializeDataModule (C:\Path\to\repositoryode_modules\@syncfusion\ej2-charts\dist\es6\ej2-charts.es5.js:12020:16)
    at Chart.processData (C:\Path\to\repositoryode_modules\@syncfusion\ej2-charts\dist\es6\ej2-charts.es5.js:11982:22)
    at Chart.cartesianChartRendering (C:\Path\to\repositoryode_modules\@syncfusion\ej2-charts\dist\es6\ej2-charts.es5.js:11589:14)
    at  (C:\Path\to\repositoryode_modules\@syncfusion\ej2-charts\dist\es6\ej2-charts.es5.js:11568:27)
    at ComponentBase.trigger (C:\Path\to\repositoryode_modules\@syncfusion\ej2-angular-base\src\component-base.js:375:21)
    at Chart.render (C:\Path\to\repositoryode_modules\@syncfusion\ej2-charts\dist\es6\ej2-charts.es5.js:11566:18)
    at Component.refresh (C:\Path\to\repositoryode_modules\@syncfusion\ej2-base\dist\es6\ej2-base.es5.js:7313:14)
    at Chart.addSeries (C:\Path\to\repositoryode_modules\@syncfusion\ej2-charts\dist\es6\ej2-charts.es5.js:12431:14)
    at populateChart (C:\Path\to\repository\src\app\chart\chart.component.ts:183:19)
    at set onUserInput (C:\Path\to\repository\src\app\chart\chart.component.ts:70:14)
    at writeToDirectiveInput (C:\Path\to\repositoryode_modules\@angular\core\fesm2022\core.mjs:11846:34)
    at setInputsForProperty (C:\Path\to\repositoryode_modules\@angular\core\fesm2022\core.mjs:12080:9)
    at elementPropertyInternal (C:\Path\to\repositoryode_modules\@angular\core\fesm2022\core.mjs:11371:9)
    at ɵɵproperty (C:\Path\to\repositoryode_modules\@angular\core\fesm2022\core.mjs:15232:9)
    at GraphComponent_Template (C:\Path\to\repository\src\app\graph\graph\graph.component.html:183:52)
    at runInContext (C:\Path\to\repositoryode_modules\@angular\core\fesm2022\core.mjs:10414:13)
    at executeTemplate (C:\Path\to\repositoryode_modules\@angular\core\fesm2022\core.mjs:10954:22)
    at refreshView (C:\Path\to\repositoryode_modules\@angular\core\fesm2022\core.mjs:12475:13)
    at detectChangesInView (C:\Path\to\repositoryode_modules\@angular\core\fesm2022\core.mjs:12639:9)
    at detectChangesInComponent (C:\Path\to\repositoryode_modules\@angular\core\fesm2022\core.mjs:12615:5)
    at detectChangesInChildComponents (C:\Path\to\repositoryode_modules\@angular\core\fesm2022\core.mjs:12653:9)
    at refreshView (C:\Path\to\repositoryode_modules\@angular\core\fesm2022\core.mjs:12525:13)
    at detectChangesInView (C:\Path\to\repositoryode_modules\@angular\core\fesm2022\core.mjs:12639:9)
    at detectChangesInEmbeddedViews (C:\Path\to\repositoryode_modules\@angular\core\fesm2022\core.mjs:12583:13)
    at refreshView (C:\Path\to\repositoryode_modules\@angular\core\fesm2022\core.mjs:12499:9)
    at detectChangesInView (C:\Path\to\repositoryode_modules\@angular\core\fesm2022\core.mjs:12639:9)
    at detectChangesInComponent (C:\Path\to\repositoryode_modules\@angular\core\fesm2022\core.mjs:12615:5)
    at detectChangesInChildComponents (C:\Path\to\repositoryode_modules\@angular\core\fesm2022\core.mjs:12653:9)
    at refreshView (C:\Path\to\repositoryode_modules\@angular\core\fesm2022\core.mjs:12525:13)
    at detectChangesInternal (C:\Path\to\repositoryode_modules\@angular\core\fesm2022\core.mjs:12417:9)
    at detectChanges (C:\Path\to\repositoryode_modules\@angular\core\fesm2022\core.mjs:12931:9)
    at tick (C:\Path\to\repositoryode_modules\@angular\core\fesm2022\core.mjs:27409:22)
    at  (C:\Path\to\repositoryode_modules\@angular\core\fesm2022\core.mjs:27569:41)
    at _ZoneDelegate.invoke (C:\Path\to\repositoryode_modules\zone.js\dist\zone.js:412:30)
    at onInvoke (C:\Path\to\repositoryode_modules\@angular\core\fesm2022\core.mjs:26274:33)
    at _ZoneDelegate.invoke (C:\Path\to\repositoryode_modules\zone.js\dist\zone.js:411:56)
    at Zone.run (C:\Path\to\repositoryode_modules\zone.js\dist\zone.js:166:47)
    at run (C:\Path\to\repositoryode_modules\@angular\core\fesm2022\core.mjs:26128:28)
    at next (C:\Path\to\repositoryode_modules\@angular\core\fesm2022\core.mjs:27568:27)
    at next (C:\Path\to\repositoryode_modules\rxjs\dist\esm\internal\Subscriber.js:91:33)
    at _next (C:\Path\to\repositoryode_modules\rxjs\dist\esm\internal\Subscriber.js:60:26)
    at next (C:\Path\to\repositoryode_modules\rxjs\dist\esm\internal\Subscriber.js:31:18)
    at  (C:\Path\to\repositoryode_modules\rxjs\dist\esm\internal\Subject.js:34:30)
    at errorContext (C:\Path\to\repositoryode_modules\rxjs\dist\esm\internal\util\errorContext.js:19:9)
    at next (C:\Path\to\repositoryode_modules\rxjs\dist\esm\internal\Subject.js:27:21)
    at emit (C:\Path\to\repositoryode_modules\@angular\core\fesm2022\core.mjs:22743:15)
    at checkStable (C:\Path\to\repositoryode_modules\@angular\core\fesm2022\core.mjs:26196:35)
    at onLeave (C:\Path\to\repositoryode_modules\@angular\core\fesm2022\core.mjs:26324:5)
    at onInvokeTask (C:\Path\to\repositoryode_modules\@angular\core\fesm2022\core.mjs:26268:17)
    at _ZoneDelegate.invokeTask (C:\Path\to\repositoryode_modules\zone.js\dist\zone.js:445:64)
    at Zone.runTask (C:\Path\to\repositoryode_modules\zone.js\dist\zone.js:211:51)
    at ZoneTask.invokeTask (C:\Path\to\repositoryode_modules\zone.js\dist\zone.js:528:38)
    at invokeTask (C:\Path\to\repositoryode_modules\zone.js\dist\zone.js:1706:22)
    at globalCallback (C:\Path\to\repositoryode_modules\zone.js\dist\zone.js:1737:31)
    at globalZoneAwareCallback (C:\Path\to\repositoryode_modules\zone.js\dist\zone.js:1773:20)

How and what can I hook to check the response before passing it on to the series? I never arrive at seriesRender, and there doesn't seem to be a beforeSeriesRender event.

Thank you!

1 Reply

NP Nishanthi Panner Selvam Syncfusion Team August 15, 2023 09:28 AM UTC

Hi Ewa,

Greetings from Syncfusion.

We have analyzed your reported scenario based on that we suggest you to use seriesRender event, which triggers before the series getting rendered.

We have attached code-snippet, sample and screenshot for your reference.

Code-snippet:

public seriesRender(args) : void {

console.log(args.data);

};

Screenshot:

Sample: https://stackblitz.com/edit/angular-ulunhf-eubgea?file=src%2Fapp.component.ts,src%2Fapp.component.html

Kindly revert us if you have any concerns.

Regards,

Nishanthi

Need More Help?

Get personalized assistance from our support team.

Contact Support

1 Reply
2 Participants
Want to subscribe?
SIGN IN
Created by
EB Ewa Baumgarten
Platform
Angular - EJ 2
Control
Chart
Created On
Aug 14, 2023 08:14 AM UTC
Last Activity On
Aug 15, 2023 09:28 AM UTC

Need More Help?

Get personalized assistance from our support team.

Contact Support