CODEWITHSUNDEEP
angularionic-framework
Erico Souza
Erico Souza

Reputation: 276

How to pass array of the object from page to component in Ionic 3?

I am developing an app, using Ionic 3 with angular 4. And I have the following problem: How can I pass an array of the object from a page, to a component? When I inform the object in my directive to the component, it is converted to a string with the following information: [Object object], [Object object], [Object object] ...

Page.html (page) code:

<ion-card *ngFor="let telemetry of listTelemetry">
    <telemetria-chart medicao="{{telemetry.medicoes}}"></telemetria-chart>
</ion-card>

Original value of 'telemetry.medicoes' : enter image description here

TelemetriaChart.ts (compenent) code:

@Component({
  selector: 'telemetria-chart',
  templateUrl: 'telemetria-chart.html'
})
export class TelemetriaChartComponent {

  @ViewChild('myChart') canvas: ElementRef;

  @Input() funcionalidadeId: any;
  @Input() medicao: any [];

  text: string;

  constructor() {
    setTimeout(() => {
      console.log('this.medicao', this.medicao);
      //...do something with this.medicao     
    }, 1000);
  }
}

Result from console.log(this.medicao): enter image description here

I need to get info from 'this.medicao'.

Upvotes: 2

Views: 3643

Answers (1)

Roman Skydan
Roman Skydan

Reputation: 5748

Change 

medicao="{{telemetry.medicoes}}"

to 

[medicao]="telemetry.medicoes"

Helpful link for you:

Angular Interpolation

There you can read about {{}}. Where we need use and what interpolation do with data inserted in it.

Component Interaction

And there you can read about component communication scenarios that we can use in angular2

Upvotes: 3

Related Questions