angular passing data to child component

MitchAloha answered on August 18, 2021 Popularity 10/10 Helpfulness 4/10

answer angular passing data to child component

related send data from child to parent in angular

related perent to child data pass in angular

related pass data from parent to child component angular 8

angular passing data to child component

Comment

Parent component:
<app-child-component [item]="data"></app-child-component>

Child component.ts
import { Component, Input } from '@angular/core'; // First, import Input
export class ItemDetailComponent {
  @Input() item = ''; // decorate the property with @Input()
}

Popularity 10/10 Helpfulness 4/10 Language javascript

Source: angular.io

Tags: angular javascript

Link to this answer
Share Copy Link

Contributed on Aug 18 2021

MitchAloha

0 Answers Avg Quality 2/10

Closely Related Answers

send data from child to parent in angular

Comment

//child 
  childData = 'Hello from child';
//parent
    <app-child #childRef></app-child>
//parent.ts
  @ViewChild('childRef') childComponent: ChildComponent;
    this.dataFromChild = this.childComponent.childData;

Popularity 10/10 Helpfulness 4/10 Language javascript

Source: Grepper

Tags: angular

Link to this answer
Share Copy Link

Contributed on Jul 24 2023

Nanu

0 Answers Avg Quality 2/10

perent to child data pass in angular

Comment

//app.html:
<h1>this is perent component</h1>
<app-child [items]="employee"></app-child>
//app.component.ts:
 employee = {
    id: 1,
    name: 'chintan',
    address: 'junagadh',
  };
//child.component.ts:
@Input() items: any;
//child.html:
<h2>{{ items.id }}</h2>
<h2>{{ items.name }}</h2>
<h2>{{ items.address }}</h2>

Popularity 10/10 Helpfulness 3/10 Language javascript

Source: Grepper

Tags: angular

Link to this answer
Share Copy Link

Contributed on Mar 03 2022

30_Savaliya Denish

0 Answers Avg Quality 2/10

pass data from parent to child component angular 8

Comment

Parent-Component

eventsSubject: Subject<void> = new Subject<void>();

emitEventToChild() {
  this.eventsSubject.next();
}
Parent-HTML
<child [events]="eventsSubject.asObservable()"> </child>
Child-Component

private eventsSubscription: Subscription;

@Input() events: Observable<void>;

ngOnInit(){
  this.eventsSubscription = this.events.subscribe(() => doSomething());
}

ngOnDestroy() {
  this.eventsSubscription.unsubscribe();
}

Popularity 1/10 Helpfulness 1/10 Language javascript

Source: Grepper

Tags: angular javascript parent pass-data

Link to this answer
Share Copy Link

Contributed on Feb 09 2022

Cautious Centipede

0 Answers Avg Quality 2/10

angular passing data to child component

Contents

More Related Answers

angular passing data to child component

Closely Related Answers

send data from child to parent in angular

perent to child data pass in angular

pass data from parent to child component angular 8

Grepper

Documentation

Social

Legal

Contact

Oops, You will need to install Grepper and log-in to perform this action.