typescript - How can I find child components by type -


i want know call method of child(a) parent(b). using output emit parent(b) child(a). , working. don't want using way. want know how can find child(a) parent(b).

a.component.ts

@import {component, eventemitter} '@angular/core'; @component({     selector: 'com-a',     template: '<button (click)="senddatas()">coma btn</button>',     outputs: ['getitems'] }) export class comaclass{     public getitem = new eventemitter<any>();     datas: any[] = ['abc', 'def'];     constructor(){         console.log('hello, i'm component a');     }     senddatas(){         this.getitem.emit(this.datas);     }     somemethod(){         console.log('call method of component a');     } } 

and b.component.ts

@import {component, ...} '...'; @import {comaclass} '~~/a.component.ts'; @component({     selector: 'com=b'     template: '<com-a name="coma1" (getitem)="getcomaitem1($event)"></com-a>         <com-a name="coma2" (getitem)="getcomaitem2($event)"></com-a>         <button (click)="callsomemethod()">comb btn</button>' }) export class combclass{     constructor(){         console.log('hello, i'm component b');     }     private getcomaitem1(event){         console.log('coma1 output event');     }     private getcomaitem2(event){         console.log('coma2 output event');     }     callsomemethod(){         // how call coma1.somemethod()?     } } 

my source running , printing on console.

hello, i'm component b hello, i'm component hello, i'm component 

i think b have compa1, compa2. b can call somemethod() of compa1. , compa2 too. want develop that. don't know how call compa1, compa2. think wrong? if think wrong. can do?? way using outputs?

please starter!!!

you can use @viewchildren(comaclass) comaclass instances in combclass's view.

export class combclass{     @viewchildren(comaclass) coma:querylist<comaclass>;      constructor() {       // this.coma not yet initialized when constructor executed     }      ngoninit() {       this.coma.toarray()[0].senddatas();     }      callsomemethod(){       this.coma.toarray()[0].somemethod();     } } 

you can use template variables address 1 specific instance

@component({     selector: 'com=b'     template: '<com-a #coma1 name="coma1" (getitem)="getcomaitem1($event)"></com-a>         <com-a #coma2 name="coma2" (getitem)="getcomaitem2($event)"></com-a>         <button (click)="callsomemethod()">comb btn</button>' }) export class combclass{     @viewchild('coma1') coma1:comaclass;     @viewchild('coma2') coma2:comaclass;      constructor(){         // this.coma1 , this.coma2 not yet initialized when constructor          console.log('hello, i'm component b');     }     private getcomaitem1(event){         console.log('coma1 output event');     }     private getcomaitem2(event){         console.log('coma2 output event');     }     callsomemethod(){         this.coma1.somemethod();         this.coma2.somemethod();     } } 

yet way pass reference using template variable

@component({     selector: 'com=b'     template: '<com-a #coma1 name="coma1" (getitem)="getcomaitem1($event)"></com-a>         <com-a #coma2 name="coma2" (getitem)="getcomaitem2($event)"></com-a>         <button (click)="callsomemethod(coma1)">comb btn</button>' }) export class combclass{     constructor(){         // this.coma1 , this.coma2 not yet initialized when constructor          console.log('hello, i'm component b');     }     private getcomaitem1(event){         console.log('coma1 output event');     }     private getcomaitem2(event){         console.log('coma2 output event');     }     callsomemethod(coma1:comaclass){         coma1.somemethod();     } } 

Comments

Popular posts from this blog

scala - 'wrong top statement declaration' when using slick in IntelliJ -

c# - DevExpress.Wpf.Grid.InfiniteGridSizeException was unhandled -

PySide and Qt Properties: Connecting signals from Python to QML -