2017-03-28 2 views
0

Ich versuche, Diagramme basierend auf einigen JSON zu zeigen. Ich habe ein Rohr, die verschiedenen Teile des Json Objekt zuzugreifen, aber nicht wissen, wie die Daten verwendet werden, die wie folgt aussieht:Angular 2 - Interpolation für NGX-Charts Ergebnisse innerhalb ngFor

[ { "name": "Completed", "value": 50 }, { "name": "Remaining", "value": 50 } ] 

im ngFor.

Also normalerweise würde ich so etwas tun:

<ngx-charts-advanced-pie-chart 
    mdTooltip="Click to change unit" 
    [tooltipDisabled] = "true" 
    [scheme]="colorScheme" 
    [results]="results"  <----this is where the results normally go 
    [gradient]="gradient" 
    [view]="view" 
    (select)="onChartClick()" 
    > 
    </ngx-charts-advanced-pie-chart> 

Und ich möchte so etwas versuchen:

<div *ngFor="let chair of targetChairs | chairDimensions"> 
    <ngx-charts-advanced-pie-chart 
    mdTooltip="Click to change unit" 
    [tooltipDisabled] = "true" 
    [scheme]="colorScheme" 
    [results]="{{ chair.value.data.height | json }}" 
    [gradient]="gradient" 
    [view]="view" 
    (select)="onChartClick()" 
    > 
    </ngx-charts-advanced-pie-chart> 
</div> 

Dies funktioniert nicht, aber ist es eine Möglichkeit, dies zu erreichen?

Antwort

1

So fand ich ein ähnliches Problem auf einer git Seite here, das mein Problem gelöst, so ist hier, was ich für den Fall, jemand verwenden anderes hat dieses Problem:

<div *ngFor="let chair of targetChairs | chairDimensions"> 
    <ngx-charts-advanced-pie-chart 
    mdTooltip="Click to change unit" 
    [tooltipDisabled] = "true" 
    [scheme]="colorScheme" 
    [results]="chair.value.data.feet" 
    [gradient]="gradient" 
    [view]="view" 
    (select)="onChartClick()" 
    > 
    </ngx-charts-advanced-pie-chart> 
</div>