Angular - parent to child component, can't call methods

Question

I want to call function from parent component for get some datas but I can't. Not getting any error but it returns undefined. Where am I wrong?

parent.component

      user:any

      dataTest(){
        console.log(this.user);
      }

child.component

    @ViewChild(AppLayoutComponent) profile!: AppLayoutComponent;
    ngAfterViewInit():void{
        this.profile?.dataTest()
      }

Answer 1

There is no "right" way, but you can pass the method as a parameter as shown in this answer

https://stackoverflow.com/a/68983527/3813454

Answer 2

@ViewChild is for accessing child component from parent but you do opposite. You should emit method on child via @Output then on parent listen and implement.

    // child component
    @Output() dataTest = new EventEmitter<void>();
    
    ngAfterViewInit(): void {
      this.dateTest.emit();
    }

    // parent html
    
    <child (dataTest)= "onDataTest()> </child>

    // parent ts
    
    public onDataTest(): void {
    // some stuff
    }