Question

我正在尝试将数组中的值转换为数千，数百万等格式。我写了一个自定义管道。我目前得到一个错误无法读取循环中的chartseries。请告诉我哪里出错了。

以下是我编写的代码，用于在组件中创建管道实例，然后将数组的值传递给我的管道。我觉得我在做的事情是错的。我基本上需要在npvresults中循环遍历chartseries数组，其类型为NpvResults。我需要将图表系列中的值从颜色转换为数千，数百万格式，然后再传递给UI。当我通过插值直接在UI中使用它时，我可以确认这个管道工作正常。在这种情况下，由于管道没有应用于高图，我需要在绑定它之前转换值。请注意我绑定result.chartseries到highchart

有人能告诉我怎么做吗

export interface NpvResults  {

        commInsYear: number[];
        commInsPremiumPaid: number[];
        commInsTaxDeduction: number[];
        commInsDiscountedTaxDeduction: number[];
        commInsDiscountedLossesPaid: number[];
        commInsGraphData: number[];
        selfInsYear: number[];
        selfInsDiscountedLossesPaid: number[];
        selfInsDiscountedTaxDeduction: number[];
        selfInsGraphData: number[];
        captiveInsYear: number[];
        captiveInsPremiumPaid: number[];
        captiveInsTaxDeduction: number[];
        captiveInsLoanToParent: number[];
        captiveInsCapitalContribution: number[];
        captiveDividentDistribution: number[];
        captiveInsTerminalValue: number[];
        captiveInsGraphData: number[];
        chartSeries: SeriesGeneric<BoxPlotSeriesData>;
    }


 export interface BoxPlotSeriesData  {

        low: number;
        q1: number;
        median: number;
        q3: number;
        high: number;
        color: string;
        name: string;
    }

Netpresent组件

import { Component, Input, OnInit } from '@angular/core';
import { NpvAnalysis, NpvAnalysisResult, createNpvAnalysisResult } from '../../../../shared/models/results';
import { ReactiveComponent } from '@wtw/toolkit/src/utils/base.component';
import { ShortNumberFormatPipe }  from '@wtw/toolkit';

@Component({
  selector: 'app-net-present-value-analysis',
  templateUrl: './net-present-value-analysis.component.html',
})
export class NetPresentValueAnalysisComponent extends ReactiveComponent implements OnInit {
  isExpanded = false;
  showTable = true;
  showProjection = false;

  public selectedAnalysis: NpvAnalysis = null;
  private shortNumberFormatPipe = new ShortNumberFormatPipe();


  @Input() set npvResults(value: Array<NpvAnalysis>) {
    this._npvResults = value;
    this.processResults();
  }

  public results: Array<NpvAnalysisResult> = [];
  private _npvResults: Array<NpvAnalysis> = [];
  public moduleName: string = '';


  constructor() {
    super();
  }

  ngOnInit() {
    this.moduleName = "npv";
  }

  processResults() {
    if (!this._npvResults) {
      return;
    }

    this.results = this._npvResults.map((result: any) => {
      return createNpvAnalysisResult(result);
    });


   for(let i =0 ; i <= this.results.length; i++)
    {
      this.shortNumberFormatPipe.transform(this.results[i].chartSeries.data[i].high);

    } 



  }

  showProjectionClick(i) {
    const results = this._npvResults[i];
    if (results) {
      this.selectedAnalysis = results;
      this.showProjection = true;
    }
  }

  hideProjection() {
    this.selectedAnalysis = null;
    this.showProjection = false;
  }
}

自定义管道

import { Pipe, PipeTransform } from '@angular/core';

@Pipe({
  name: 'shortNumberFormat'
})
export class ShortNumberFormatPipe implements PipeTransform {

  transform(number: any, decimals = 0) {

    if (number === null) {
      return;
    }

    number = parseFloat(number);

    if (isNaN(number)) {
      return;
    }

    if (isNaN(decimals)) {
      return;
    }

    const signPrefix = number < 0 ? '-' : '';
    number = Math.abs(number);

    if (number <= 999) { // hundreds
      number = number.toFixed(decimals);
    } else if (number >= 1000 && number <= 999999) {  // thousands
      number = (number / 1000).toFixed(decimals) + 'K';
    } else if (number >= 1000000 && number <= 999999999) { // millions
      number = (number / 1000000).toFixed(decimals) + 'M';
    } else { // billions
      number = (number / 1000000000).toFixed(decimals) + 'B';
    }

    return signPrefix + number;
  }
}

无法转换angular4中的数字格式

0 个答案: