Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

ngx-charts-number-card[customColors] passes the name and not the value

See original GitHub issue

I’m submitting a … (check one with “x”)

bug report - search github for a similar issue or PR before submitting
feature request
support request - use StackOverflow (add the ngx-charts tag) or the gitter chat for support questions

Current behavior ngx-charts-number-card[customColors] passes the name and not the value

Expected behavior ngx-charts-number-card[customColors] passes the value and not the name (as in documentation: “custom colors for the chart. Used to override a color for a specific value”). Ideally should inject the name and the value as a whole object {"name": "the name", "value": "the value"}

Reproduction of the problem the-template.html

<ngx-charts-number-card
    [view]="viewSize"
    [customColors]="colorFun"
    [results]="ratings">
  </ngx-charts-number-card>

the-component.ts

colorFun(x: any): string {
    console.log('colorFun: x:', x);
    //Not working because x is the name and not the value
    // return x < 1.5 ? 'red' : (x < 1.7 ? 'yellow' : 'green');
    // return x.value < 1.5 ? 'red' : (x.value < 1.7 ? 'yellow' : 'green');
    return 'green';
  }

What is the motivation / use case for changing the behavior? Conformance with the documentation.

Please tell us about your environment:

Linux, Emacs, npm

ngx-charts version: @swimlane/ngx-charts@8.1.0
Angular version:

@angular-devkit/architect         0.6.8
@angular-devkit/build-angular     0.6.8
@angular-devkit/build-optimizer   0.6.8
@angular-devkit/core              0.6.8
@angular-devkit/schematics        0.6.8
@angular/cdk                      6.3.2
@angular/cli                      6.0.8
@angular/material                 6.3.2
@ngtools/webpack                  6.0.8
@schematics/angular               0.6.8
@schematics/update                0.6.8
rxjs                              6.2.1
typescript                        2.7.2
webpack                           4.8.3