Reload balance chart on parameter change.

src/operations/balanceChart.component.ts

@@ -3,13 +3,14 @@
 import * as moment from 'moment';
 
 import {
-  Component,
+  Component, ViewChild,
   Inject, Input, Output, EventEmitter,
   OnInit, OnChanges
 } from '@angular/core';
-import { ActivatedRoute, Router } from '@angular/router';
+import { ActivatedRoute, Router, ParamMap } from '@angular/router';
 
 import { Logger } from '@nsalaun/ng-logger';
+import { jqxChartComponent } from 'jqwidgets-scripts/jqwidgets-ts/angular_jqxchart';
 
 import { Account } from '../accounts/account';
 import { DailyBalance } from './dailyBalance';
@@ -39,6 +40,7 @@ class DateRange {
 export class BalanceChartComponent implements OnInit, OnChanges {
   @Input() account: Account;
   @Output() onUpdate: EventEmitter<DateRange> = new EventEmitter<DateRange>();
+  @ViewChild('balanceChart') chart: jqxChartComponent;
 
   public data;
 
@@ -160,6 +162,21 @@ export class BalanceChartComponent implements OnInit, OnChanges {
   }
 
   ngOnInit() {
+    this.activatedRoute.queryParamMap.subscribe((params: ParamMap) => {
+      let fromDay = params.get('from');
+      let toDay = params.get('to');
+
+      this.logger.info('Setting from and to', fromDay, toDay);
+
+      this.xAxis.minValue = moment(fromDay).toDate();
+      this.xAxis.maxValue = moment(toDay).toDate();
+
+      if(this.chart && this.chart.host) {
+        this.logger.info('Chart', this.chart);
+        this.chart.refresh();
+      }
+    });
+
     this.loadData();
   }