If use ChangeDetectionStrategy.OnPush + Observable, the chart never update

[javico2609]

I'm submitting a ... (check one with "x")

[x ] bug report => search github for a similar issue or PR before submitting
[ ] feature request
[ ] support request => Please do not submit support request here

Current behavior If use ChangeDetectionStrategy.OnPush + Observable, the chart never update

Expected behavior Proper update of the chart

Reproduction of the problem

 public dataDemo$: BehaviorSubject<any[]> = new BehaviorSubject([]);
 Observable.interval(10000).subscribe( index => {
      const value =  {
        name: `Ramdon-${index}`,
        value: index * 100
      };

      this.dataDemo$.next( [...this.oldValues, value]  );
    })

 <ngx-charts-pie-chart
        [scheme]="colors"
        [results]="dataDemo$ | async"
        [labels]="true">
 </ngx-charts-pie-chart>

What is the motivation / use case for changing the behavior?

Please tell us about your environment:

WebStorm, Yarn v1.2.0

• ngx-charts version: x.x.x "@swimlane/ngx-charts": "^6.1.0",

• Angular version: 2.x.x "@angular/": "^4.4.5",

• Browser: [all | Chrome XX | Firefox XX | IE XX | Safari XX | Mobile Chrome XX | Android X.X Web Browser | iOS XX Safari | iOS XX UIWebView | iOS XX WKWebView ]

  Chrome 61.0.3163.100

• Language: [all | TypeScript X.X | ES6/7 | ES5]

[sandangel]

you have to subscribe to the observable and add private cd: ChangeDetectorRef dependency in your component constructor. Then in the subscribe method when a change happen call this.cd.markForCheck().

[martijnhiemstra]

I have added the private cd: ChangeDetectorRef to the constructor and when I update the data for the pie/bar chart using this.cd.markForCheck() then it still doesn't work!