Angular 4/ 5 data from one component to another

Question

Ways of passing data from one component to another in angular 4 or 5

Ramesh Palanivel · Answer

Hi Nithi, Create it as service

Bhairab Dutt · Answer

Hi nithi, 1- If you want to pass the data from parent component to child component you can use @Input decorator as below: //Parent Component import { Component } from '@angular/core' @Component({ selector: 'parent-app', template: ` }) export class ParentComponent{ pdata: string = 'test'; } //Child Component import { Component, Input } from '@angular/core'; @Component({ selector: 'child-app', template: ` {{ parentdata }} ` }) export class ChildComponent { @Input() parentdata: string; } 2- If you want to pass data from child to parent compoent you can use : a- Output () decorator and EventEmitter b- ViewChid 3- In case if you want to pass the data from one component to another component you can use service. Hope its help you. Thanks.

Debasis Saha · Answer

Hi Nithi, There are several ways to pass data from one component to another component. 1. Can create service 2. Can send data from one component to another child component using Input Properties of the component. 3. Can invoke component's public method to pass data into another component using ViewChild. Hope this will help you.