Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Call a method of the child component

I have a nested child component like this:

<app-main>     <child-component /> </app-main> 

My appMain component needs to invoke a method on child-component.

How to invoke a method on the child-component?

like image 791
Per Hornshøj-Schierbeck Avatar asked Jun 23 '15 21:06

Per Hornshøj-Schierbeck


People also ask

How do you call a method in child component Vue?

To call a method in a child component with Vue. js, we can pass in a prop from the parent component to its child. Then in the child component, we watch the prop's value and run the method we want. in the child component to register the testProp prop and add the sayHello method.

How do you call a method in parent component from a child component?

It's better to pass props into the child component and then have a button click in the parent change the parent's state, and pass a state item into the child which will trigger the child's componentWillReceiveProps , and use that as a trigger.

How do you call a child component method from parent in Salesforce?

Step 1) Create Child component with Aura:Method. Step 2) Create Child Class Controller to Get argument "event. getParam('arguments');" and return the message. Step 3) Create a parent Component and a button to call Aura method.

How do you call a child method in LWC?

in LWC, we have to use the @api decorator to make the children properties/method public available so a parent can be able to call it directly using JavaScript API. For example, create one public method (which we need to access in parent component) in ChildComponent with @api decorator like below.


1 Answers

You can get a reference to an element using

@ViewChild('childComponent') child; 

where childComponent is a template variable <some-elem #childComponent>` or

@ViewChild(ComponentType) child; 

where ComponentType is the type of a component or directive and then in ngAfterViewInit or an event handlers call child.someFunc().

ngAfterViewInit() {   console.log(this.child); } 

See also get hold of an element in the template

like image 188
Günter Zöchbauer Avatar answered Sep 19 '22 01:09

Günter Zöchbauer