NgxChartsComponent_Host.ngfactory.js? [sm]:1 ERROR TypeError: Cannot read property 'map' of undefined

霸气de小男生 提交于 2020-01-25 06:50:26

问题


This is the content of stock_inf.ts file(Actually there are bigger and different arrays, but just for summery i Put these similar arrays):

export const Mellat = [1789.35, 1762.42, 1770.88, 1771.65, 1776.27, 1766.26, 1706.23];

export const Khodro= [1789.35, 1762.42, 1770.88, 1771.65, 1776.27, 1766.26, 1706.23];

export const Shepna= [1789.35, 1762.42, 1770.88, 1771.65, 1776.27, 1766.26, 1706.23];

This is a part of flow.component.ts file and these are some functions of (click) events on some forms and other flow objects:

  setInput(selectedValue){
    console.log('The selected input is:' , selectedValue);
    switch(selectedValue){
      case 'وبملت':
        pricess = this.mellat;
        this.label1 = 'نام سهام: بانک ملت';
        break;
      case 'خودرو':
        pricess = this.khodro;
        this.label1 = 'نام سهام: ایران خودرو ';
        break;
      case 'شپنا':
        pricess = this.shepna;
        this.label1 = 'نام سهام: پالایش نفت اصفهان ';
        break;
      default: 
        break;

    }
  }

  setRsi(selectedValue){
    console.log('The RSI period is:' , selectedValue);
    periodd = selectedValue;
    this.label2 = ' نام اندیکاتور:  RSI';
    this.label3 = ' دوره زمانی: ' + periodd + 'روزه';
    rsi_result = rsi({period: periodd, values: pricess});
    console.log('The RSI result is:' ,  rsi_result);
  }

  setMacd(selectedValue1, selectedValue2){
    console.log('The MACD period one is:' , selectedValue1);
    console.log('The MACD period two is:' , selectedValue2);
    this.label2 = 'نام اندیکاتور:  MACD';
    periodd  = selectedValue1;
    this.label3 = ' دوره زمانی: ' + periodd + ' روزه';
    //this.macd_p2 = selectedValue2;
    this.doMacd(periodd, pricess);
  }



  doMacd(periodd , pricess){
    macd_result = sma({period: periodd, values: pricess});
    console.log('sma result is:' , macd_result );
  }

  doOutput(){
    this.dialog.open(NgxChartsComponent ) ; //, {width: '500px', height: '500px'});

  }


}

export const RSI_RESULT = rsi_result;
export const MACD_RESULT = macd_result;

And the following is the content of ngx-charts.component.ts file:

import { Component, OnInit } from '@angular/core';
import {MatDialog, MatDialogRef} from '@angular/material';

import {MACD_RESULT , RSI_RESULT} from '../flow/flow.component';
import {Mellat, Khodro, Shepna} from '../shared/stock_inf';
import { NewsComponent } from '../news/news.component';


@Component({
  selector: 'app-ngx-charts',
  templateUrl: './ngx-charts.component.html',
  styleUrls: ['./ngx-charts.component.scss']
})



export class NgxChartsComponent implements OnInit {

  constructor(public dialogRef: MatDialogRef<NgxChartsComponent>) { }



  // data goes here
public single = [
  {
    "name": " درصد سود",
    "value": 69
  },
  {
    "name": " درصد زیان",
    "value": 31
  },

];


mellat = Mellat;
khodro = Khodro;
shepna = Shepna;

 macd_result = MACD_RESULT;
 rsi_result = RSI_RESULT;
// LENGTH = RSI_RESULT.length;
 newArray = RSI_RESULT.map((e, i) => ({
  name: (i + 1).toString(),
  "value": e,
}));


public mmulti = [
  {
    "name": "Mellat",
    "series": this.newArray
  },

  {
    "name": "Khodro",
    "series": this.newArray
  },

  {
    "name": "Shepna",
    "series": this.newArray
  }
];

//{name: (i + 1).toString(), value: e.toString()}



  view: any[] = [700, 400];

  // options for the chart
  showXAxis = true;
  showYAxis = true;
  gradient = false;
  showLegend = true;
  showXAxisLabel = true;
  xAxisLabel = 'زمان';
  showYAxisLabel = true;
  yAxisLabel = 'قیمت';
  timeline = true;

  colorScheme = {
    domain: ['#5AA454', '#A10A28', '#C7B42C', '#AAAAAA']
  };

  // line, area
  autoScale = true;

  //pie
  showLabels = true;
  explodeSlices = false;
  doughnut = false;

  ngOnInit() {
    console.log(this.newArray);

  }
}

Finally ngx-charts.component.html file:

<!-- The chart type goes in here -->
<div> نمایش نتایج حاصل از اعمال استراتژی</div>
<div style="display: inline-block; direction: rtl;">
    <ngx-charts-line-chart
      [view]="view"
      [scheme]="colorScheme"
      [results]="multi"
      [gradient]="gradient"
      [xAxis]="showXAxis"
      [yAxis]="showYAxis"
      [legend]="showLegend"
      [showXAxisLabel]="showXAxisLabel"
      [showYAxisLabel]="showYAxisLabel"
      [xAxisLabel]="xAxisLabel"
      [yAxisLabel]="yAxisLabel"
      [autoScale]="autoScale"
      [timeline]="timeline"
      (select)="onSelect($event)">
    </ngx-charts-line-chart>
  </div>


    <br>
    <div> نتیجه ی سیگنالهای معاملاتی و سود و زیان</div>

    <div style="display: inline-block; direction: rtl;">
    <ngx-charts-pie-chart
    [view]="view"
    [scheme]="colorScheme"
    [results]="single"
    [legend]="showLegend"
    [explodeSlices]="explodeSlices"
    [labels]="showLabels"
    [doughnut]="doughnut"
    [gradient]="gradient"
    (select)="onSelect($event)">
  </ngx-charts-pie-chart>
</div>

What I am doing is playing with flow objects and get RSI_RESULT or MACD_RESULT as arrays, then passing them to above code and merge it with indices and try to ploting them. I also tried to add other stocks to make a series in multi array but it doesn't work. This is the error I get:

ERROR TypeError: Cannot read property 'map' of undefined
    at new NgxChartsComponent (ngx-charts.component.ts:44)
    at createClass (core.js:27865)
    at createDirectiveInstance (core.js:27685)
    at createViewNodes (core.js:38315)
    at createRootView (core.js:38187)
    at callWithDebugContext (core.js:39716)
    at Object.debugCreateRootView [as createRootView] (core.js:38953)
    at ComponentFactory_.create (core.js:26827)
    at ComponentFactoryBoundToModule.create (core.js:22791)
    at ViewContainerRef_.createComponent (core.js:26983)

来源:https://stackoverflow.com/questions/59791587/ngxchartscomponent-host-ngfactory-js-sm1-error-typeerror-cannot-read-proper

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!