Send data from parent to child

Send data from parent to child

Posted by: mark.goldin on 4 December 2019, 3:59 am EST

• 

  mark.goldin

  • Post Options:
  • Link
    Copy
  • Jump To Answer

  Posted 4 December 2019, 3:59 am EST

  I have a child component with selector: app-wijmo-statistics.
  
  I then implement this component into another component like this:
  
  
  
  What I want is to add something to the above code that can be accessed in the child component?

  Thanks

• 

  ashwin.saxena

  

  • Post Options:
  • Link
    Copy

  Posted 4 December 2019, 6:04 pm EST

  Hi Mark,

  You will need to use the @Input decorator of the Angular component to provide data to the child component. To do this, first you will need to create a variable in the child’s component file:

  export class HelloComponent  {
    @Input() source: any;
  }
  

  Then, provide the data from the parent component by accessing the source variable:

  <hello [source]="data"></hello>
  

  You may refer to the sample below:

  https://stackblitz.com/edit/angular-uhawqp

  In this sample, I have passed the data source of the FlexGrid from the parent component (app.component) to the child component (hello.component) and then to the FlexGrid.

  You can read more about the @Input decorator from the link below:

  https://angular.io/api/core/Input

  Regards,
  
  Ashwin