0

Estoy usando la librería ng2-chart y deseo pasar la informacion de un componente padre al comonente hijo. La informacion la obtengo desde una API que me proporciona los datos. Pero no está cargando la informacion:

export class PruebasComponent implements OnInit {

  lineChartData: ChartDataSets[];
  lineChartLabels: Label[];

En el ngOnInit obtengo la data

ngOnInit() {
    this.loading = true;


    this.datos.getDesktopLimit().subscribe(
      res => {
        this.loading = false;
        this.data = [res];
        this.dataSource = this.data[0];
        this.barChartData = true;
        this.getFilter(this.dataSource);
      }
    )
  }

y a través de la funcion getFilter() logro modificar los datos que quiero enviar:

  getFilter(data) {

     data.sort((a, b) => a.id - b.id);
    for (let entry of data) {
      this.date.push(moment(entry.created).format('DD-MM-YYYY HH:mm'))
      this.time.push(entry.total_load_time * 0.001)
    }

    this.lineChartData =  [{ data: this.time, label: 'Time Render' }]  /* [ { data: [65, 59, 80, 81, 56, 55, 40], label: 'Series A' }] */;

    this.lineChartLabels = this.date;

    this.loading = false
  }

[datasets] està enviado el dato vacio

 <app-graphic [datasets]="[lineChartData]" [labels]="lineChartLabels"></app-graphic>
8
  • Quitale los [] y solo envia lineChartData [datasets]="lineChartData"
    – GFlores98
    Commented el 8 nov. 2019 a las 16:23
  • Otro posible problema es que el componente se genera antes de que tu objeto "lineChartData" este lleno y por eso se envia vacio tal y como esta declarado
    – GFlores98
    Commented el 8 nov. 2019 a las 16:26
  • Ya lo acabo de quitar, pero el componenet hijo recibe un undefined [datasets]="lineChartData" Commented el 8 nov. 2019 a las 16:27
  • Es la segunada opcion que me estas dando, dado que paso el arreglo hardcodeado en el ngoninit y funciona, pero tambien los paso en el funcion getfiler no los envía Commented el 8 nov. 2019 a las 16:30
  • 1
    <app-graphic *ngIf="!this.loading" [datasets]="[lineChartData]" [labels]="lineChartLabels"></app-graphic>
    – GFlores98
    Commented el 8 nov. 2019 a las 16:36

1 respuesta 1

1

Intenta cargar tu componente hasta que la data haya sido cargada en tu variable, segun veo usas la variable "loading"

<app-graphic *ngIf="!this.loading" [datasets]="[lineChartData]" [labels]="lineChartLabels"></app-graphic>

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.