'Angular EventEmitter in merge()

I made a component that shows a list of data-items which can be changed either by pageSelection, sortOrder or filterChanges.

This is the code:

import { EventEmitter } from '@angular/core';
import { merge } from 'rxjs';
import { MatPaginator, MatSort } from '@angular/material';

@ViewChild(MatPaginator) paginator: MatPaginator;
@ViewChild(MatSort) sort: MatSort;
filterChange = new EventEmitter<any>();

merge(
            this.sort.sortChange.pipe(tap((sort: Sort) => {
                this.currentSortColumn = sort.active;
                this.currentSortDirection = sort.direction;
            })),
            this.paginator.page.pipe(tap((page: PageEvent) => {
                this.currentPageIndex = page.pageIndex;
                this.currentPageSize = page.pageSize;
            })),
            this.filterChange.pipe(tap((filter: any) => {
                console.log('filterChanged');
                this.currentFilter = filter;
            }))
        ).subscribe(()=> refreshData());

Selecting a different page or changing the sort order works, but nothing happens when I call filterChange.emit(newFilter);

this.filterChange.subscribe((filter) => console.log(filter)); does work.

there is no exception or errorMessage at all. Could you point out to me what I have missed?



Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source