Material table with filter in each header

Im doing a table with materiwl where is required to have a filter input for each column on the header.
The code is below and the problem is that while triggering the input for searching the sorting is also trigered.

Its any way not to trigger sorting while try to insert into the input field.

https://stackblitz.com/edit/new-project-3gxwan?file=src%2Fapp%2Fshared%2Fcomponents%2Fformly-table-generic%2Ftable.ts,src%2Fapp%2Fproduct-data-fromAPI.ts

>Solution :

add this (click)="$event.stopPropagation();" on your filter input

<ng-container *ngIf="currentField.key != 'check';else second">
        <th mat-header-cell *matHeaderCellDef mat-sort-header>
          {{ currentField.name}}
          <input
            type="search"
            (click)="$event.stopPropagation();"
            (keyup)="filter($event.target.value, I)" (keydown.space)="$event.stopPropagation()"
          />
        </th>
        <td mat-cell *matCellDef="let element">
          <formly-field [field]="element.fieldGroup[i]"></formly-field>
        </td>
      </ng-container>