CODEWITHSUNDEEP
angular
pranami
pranami

Reputation: 1415

How to call a method from one component to another in angular

I want to call a method in another component when the tab is clicked. The below function is called in the parent component of the tab and that is where I want the function call to happen:

 updateactiveTab(activeTab: string) {
    console.log('activetab', activeTab)
    this.activetab = activeTab;
    if(this.activetab === 'Status') {
      console.log('I am in Status tab');
     //Call the method here
    }

  }

I get this error:

Property 'getJobstatusdata' does not exist on type 'typeof JobStatusComponent'.

Upvotes: 1

Views: 504

Answers (2)

IAfanasov
IAfanasov

Reputation: 4993

The call of the component's method from the other one is a smell. Usually, that means with slight changes in design @Input and @Output would be suitable. For example getJobstatusdata(host) method might be changed so that host would be an @Input and the getJobstatusdata would be call whenever property @Input() host is changed.

Anyway, if JobStatusComponent is child of the TraceLogpageComponent you might leverage @ViewChild directive. Otherwise, I would really suggest reviewing the design. Using a shared service with the observable or move getJobstatusdata into service.

Upvotes: 1

goro0710
goro0710

Reputation: 11

You can use angular service to implement getJobstatusdata() method. Then pass the instance of the new service in constructor of TraceLogpageComponent or JobStatusComponent as you like. You should be able to fetch setTableData without actually calling the api again and again or pass boolean parameter to getJobstatusdata() when you need to refresh table data.

Upvotes: 1

Related Questions