CODEWITHSUNDEEP
angular
KeyserSoze_AN
KeyserSoze_AN

Reputation: 9

Use a variable of a component with a method of another component in angular?

I will report just the parts of code that you need to understand my problem, I have a component called filter and a component called details.

In filter component HTML file I have a button that calls a function of the details component, to do this I used EventEmitter like this:

In filter component html I have

  <button (click)="emitItemsToFilter()">apply</button>

And in filter component TS I have

@Component({
  selector: 'app-modal-filter',
     @Output() applyFilter = new EventEmitter <any>();
    
     emitItemsToFilter(): void {
        let **Actualfilter**=[...this.selectedMenuItems][0];
        this.applyFilter.emit();
      }

Then in details component I did this to call the function of the component

   <app-modal-filter (applyFilter)="populateTable(true, **VARIABLE-Actualfilter-THAT-I-NEED-FROM-FILTER**)"></app-modal-filter>

Now I want to use that ActualFilter value as an attribute of that populateTable function, how can I do this?

Upvotes: 0

Views: 22

Answers (1)

AidH
AidH

Reputation: 650

First, you are not emitting anything. You should emit like: this.applyFilter.emit(actualFilter); and use typed variable instead of any.

In details.html, you should write something like this:

<app-modal-filter (applyFilter)="populateTable(true, $event)"></app-modal-filter>

Upvotes: 1

Related Questions