Angular Components Interaction

Component Extends another component

Component Interaction : This cookbook contains recipes for common component communication scenarios in which two or more components share information.

Parent calls an @ViewChild() ^Example

When the parent component class requires that kind of access, inject the child component into the parent as a ViewChild.

Component 1(child):

@Component(
  selector:'com1'
)
export class Component1{
  function1(){...}
}

Component 2(parent):

@Component(
  selector:'com2',
  template: `<com1 #component1></com1>`
)
export class Component2{
  @ViewChild("component1") component1: Component1;

  function2(){
    this.component1.function1();
  }
}

---